diff --git a/showcase/entries/Continuous.re b/showcase/entries/Continuous.re
index 12d34bd3..e801baf4 100644
--- a/showcase/entries/Continuous.re
+++ b/showcase/entries/Continuous.re
@@ -1,7 +1,10 @@
-// "mm(floor(uniform(30,35)), normal(50,20), [.25,.5])",
-// "mm(floor(normal(28,4)), normal(32,2), uniform(20,24), [.5,.2,.1])",
+// Examples:
+// mm(floor(uniform(30,35)), normal(50,20), [.25,.5])
+// mm(floor(normal(28,4)), normal(32,2), uniform(20,24), [.5,.2,.1])
+// mm(5 to 20, floor(normal(20,2)), [.5, .5])"
+// floor(3 to 4)
+// uniform(0,1) > 0.3 ? lognormal(6.652, -0.41): 0
-// "mm(5 to 20, floor(normal(20,2)), [.5, .5])",
let timeDist =
DistPlusIngredients.make(
~guesstimatorString="(floor(10 to 15))",
@@ -36,4 +39,4 @@ let distributions = () =>
;
-let entry = EntryTypes.(entry(~title="Pdf", ~render=distributions));
\ No newline at end of file
+let entry = EntryTypes.(entry(~title="Pdf", ~render=distributions));
diff --git a/src/components/DistBuilder.re b/src/components/DistBuilder.re
index 5c1e6147..70dde01d 100644
--- a/src/components/DistBuilder.re
+++ b/src/components/DistBuilder.re
@@ -375,60 +375,68 @@ let make = () => {
}
/>
-
-
- E.ste}>
- {
- e |> handleChange;
- _ => ();
- }}
- />
-
- }
- />
-
-
-
- E.ste}>
- e |> handleChange}>
-
- {"Days" |> E.ste}
-
-
- {"Hours" |> E.ste}
-
-
- {"Milliseconds" |> E.ste}
-
-
- {"Minutes" |> E.ste}
-
-
- {"Months" |> E.ste}
-
-
- {"Quarters" |> E.ste}
-
-
- {"Seconds" |> E.ste}
-
-
- {"Weeks" |> E.ste}
-
-
- {"Years" |> E.ste}
-
-
-
- }
- />
-
+ {<>
+
+
+ E.ste}>
+ {
+ e |> handleChange;
+ _ => ();
+ }}
+ />
+
+ }
+ />
+
+
+
+ E.ste}>
+ e |> handleChange}>
+
+ {"Days" |> E.ste}
+
+
+ {"Hours" |> E.ste}
+
+
+ {"Milliseconds" |> E.ste}
+
+
+ {"Minutes" |> E.ste}
+
+
+ {"Months" |> E.ste}
+
+
+ {"Quarters" |> E.ste}
+
+
+ {"Seconds" |> E.ste}
+
+
+ {"Weeks" |> E.ste}
+
+
+ {"Years" |> E.ste}
+
+
+
+ }
+ />
+
+ >
+ |> E.showIf(
+ E.L.contains(
+ reform.state.values.unitType,
+ ["TimeDistribution"],
+ ),
+ )}
@@ -453,4 +461,4 @@ let make = () => {
;
-};
\ No newline at end of file
+};
diff --git a/src/components/DistBuilder2.re b/src/components/DistBuilder2.re
index d6cb3eb0..b077f57b 100644
--- a/src/components/DistBuilder2.re
+++ b/src/components/DistBuilder2.re
@@ -34,8 +34,7 @@ module Styles = {
module DemoDist = {
[@react.component]
let make = (~guesstimatorString: string) => {
- let (ys, xs) =
- DistEditor.getPdfFromUserInput("normal(1, 1) / normal(10, 1)");
+ let (ys, xs) = DistEditor.getPdfFromUserInput(guesstimatorString);
let continuous: DistTypes.xyShape = {xs, ys};
E.ste}>
diff --git a/src/components/charts/DistributionPlot/distPlotD3.js b/src/components/charts/DistributionPlot/distPlotD3.js
index dfdc4af6..e781576d 100644
--- a/src/components/charts/DistributionPlot/distPlotD3.js
+++ b/src/components/charts/DistributionPlot/distPlotD3.js
@@ -109,22 +109,28 @@ export class CdfChartD3 {
`translate(${this.calc.chartLeftMargin}, ${this.calc.chartTopMargin})`,
);
+ const common = this.getCommonThings();
if (this.hasDate('continuous')) {
- const distributionChart = this.addDistributionChart();
- if (this.hasDate('discrete')) {
- this.addLollipopsChart(distributionChart);
- }
+ this.addDistributionChart(common);
+ }
+ if (this.hasDate('discrete')) {
+ this.addLollipopsChart(common);
}
return this;
}
- addDistributionChart() {
- const areaColorRange = d3.scaleOrdinal().range(this.attrs.areaColors);
- const dataPoints = [this.getDataPoints('continuous')];
-
+ /**
+ * @returns {*}
+ */
+ getCommonThings() {
// Boundaries.
- const xMin = this.attrs.minX || d3.min(this.attrs.data.continuous.xs) || d3.min(this.attrs.data.discrete.xs);
- const xMax = this.attrs.maxX || d3.max(this.attrs.data.continuous.xs) || d3.max(this.attrs.data.discrete.xs);
+ const xMin = this.attrs.minX
+ || d3.min(this.attrs.data.continuous.xs)
+ || d3.min(this.attrs.data.discrete.xs);
+ const xMax = this.attrs.maxX
+ || d3.max(this.attrs.data.continuous.xs)
+ || d3.max(this.attrs.data.discrete.xs);
+
const yMin = d3.min(this.attrs.data.continuous.ys);
const yMax = d3.max(this.attrs.data.continuous.ys);
@@ -150,6 +156,21 @@ export class CdfChartD3 {
.domain([yMinDomain, yMaxDomain])
.range([this.calc.chartHeight, 0]);
+ return {
+ xMin, xMax,
+ xScale, yScale,
+ };
+ }
+
+ /**
+ * @param common
+ */
+ addDistributionChart(common) {
+ const areaColorRange = d3.scaleOrdinal().range(this.attrs.areaColors);
+ const dataPoints = [this.getDataPoints('continuous')];
+
+ const { xMin, xMax, xScale, yScale } = common;
+
// X-axis.
let xAxis = null;
if (!!this.attrs.timeScale) {
@@ -287,16 +308,14 @@ export class CdfChartD3 {
.on('mousemove', mouseover)
.on('mouseout', mouseout);
}
-
- return { xScale, yScale };
}
/**
- * @param {object} distributionChart
- * @param {object} distributionChart.xScale
- * @param {object} distributionChart.yScale
+ * @param {object} common
+ * @param {object} common.xScale
+ * @param {object} common.yScale
*/
- addLollipopsChart(distributionChart) {
+ addLollipopsChart(common) {
const data = this.getDataPoints('discrete');
const _yMin = d3.min(this.attrs.data.discrete.ys);
@@ -306,7 +325,7 @@ export class CdfChartD3 {
this.chart.append('g')
.attr('class', 'lollipops-x-axis')
.attr('transform', `translate(0, ${this.calc.chartHeight})`)
- .call(d3.axisBottom(distributionChart.xScale));
+ .call(d3.axisBottom(common.xScale));
// Y-domain.
const yMaxDomainFactor = _.get(this.attrs, 'yMaxDiscreteDomainFactor', 1);
@@ -333,7 +352,7 @@ export class CdfChartD3 {
tooltip.transition()
.style('opacity', .9);
tooltip.html(`X: ${d.x}, Y: ${d.y}`)
- .style('left', (distributionChart.xScale(d.x) + 60) + 'px')
+ .style('left', (common.xScale(d.x) + 60) + 'px')
.style('top', yScale(d.y) + 'px');
}
@@ -354,8 +373,8 @@ export class CdfChartD3 {
.append('line')
.attr('class', 'lollipops-line')
.attr('id', d => 'lollipops-line-' + d.id)
- .attr('x1', d => distributionChart.xScale(d.x))
- .attr('x2', d => distributionChart.xScale(d.x))
+ .attr('x1', d => common.xScale(d.x))
+ .attr('x2', d => common.xScale(d.x))
.attr('y1', d => yScale(d.y))
.attr('y2', yScale(0));
@@ -371,7 +390,7 @@ export class CdfChartD3 {
.append('circle')
.attr('class', 'lollipops-circle')
.attr('id', d => 'lollipops-circle-' + d.id)
- .attr('cx', d => distributionChart.xScale(d.x))
+ .attr('cx', d => common.xScale(d.x))
.attr('cy', d => yScale(d.y))
.attr('r', '4');
@@ -382,7 +401,7 @@ export class CdfChartD3 {
.append('rect')
.attr('width', 30)
.attr('height', this.calc.chartHeight)
- .attr('x', d => distributionChart.xScale(d.x) - 15)
+ .attr('x', d => common.xScale(d.x) - 15)
.attr('y', 0)
.attr('opacity', 0)
.attr('pointer-events', 'all')
@@ -439,7 +458,10 @@ export class CdfChartD3 {
const len = data.xs.length;
for (let i = 0; i < len; i++) {
- dt.push({ x: data.xs[i], y: data.ys[i], id: i });
+ const x = data.xs[i];
+ const y = data.ys[i];
+ const id = i;
+ dt.push({ x, y, id });
}
return dt;