Adds stop conditions

src/components/charts/CdfChart__Base.re

@@ -28,6 +28,7 @@ let make =
       ~discrete=?,
       ~scale=?,
       ~showDistributionLines=?,
+      ~showDistributionYAxis=?,
       ~showVerticalLine=?,
       ~timeScale=?,
       ~verticalLine=?,
@@ -47,6 +48,7 @@ let make =
         ~discrete?,
         ~scale?,
         ~showDistributionLines?,
+        ~showDistributionYAxis?,
         ~showVerticalLine?,
         ~timeScale?,
         ~verticalLine?,

src/components/charts/CdfChart__Plain.re

@@ -27,13 +27,16 @@ module Styles = {
 let make =
     (
       ~color=`hex("111"),
-      ~primaryDistribution=?,
       ~discrete=?,
       ~height=200,
       ~maxX=?,
       ~minX=?,
       ~onHover: float => unit,
+      ~primaryDistribution=?,
       ~scale=?,
+      ~showDistributionLines=false,
+      ~showDistributionYAxis=false,
+      ~showVerticalLine=false,
       ~timeScale=?,
     ) => {
   <div className={Styles.graph(color)}>
@@ -42,6 +45,7 @@ let make =
       ?minX
       ?scale
       ?timeScale
+      discrete={discrete |> E.O.fmap(d => d |> Shape.Discrete.toJs)}
       height
       marginBottom=50
       marginTop=0
@@ -49,9 +53,9 @@ let make =
       primaryDistribution={
         primaryDistribution |> E.O.fmap(pd => pd |> Shape.XYShape.toJs)
       }
-      discrete={discrete |> E.O.fmap(d => d |> Shape.Discrete.toJs)}
-      showDistributionLines=false
-      showVerticalLine=false
+      showDistributionLines
+      showDistributionYAxis
+      showVerticalLine
     />
   </div>;
 };

src/components/charts/GenericDistributionChart.re

@@ -16,6 +16,7 @@ module Mixed = {
             color={`hex("333")}
             timeScale
             onHover={r => setX(_ => r)}
+            showDistributionYAxis=true
           />,
         [|data|],
       );

src/components/charts/cdfChartD3.js

@@ -20,11 +20,15 @@ export class CdfChartD3 {
       scale: 'linear',
       timeScale: null,
       showDistributionLines: true,
+      showDistributionYAxis: false,
       areaColors: ['#E1E5EC', '#E1E5EC'],
       logBase: 10,
       verticalLine: 110,
       showVerticalLine: true,
-      data: null,
+      data: {
+        primary: null,
+        discrete: null,
+      },
       onHover: (e) => {
       },
     };
@@ -103,6 +107,11 @@ export class CdfChartD3 {
     return this;
   }
 
+  showDistributionYAxis(showDistributionYAxis) {
+    this.attrs.showDistributionYAxis = showDistributionYAxis;
+    return this;
+  }
+
   verticalLine(verticalLine) {
     this.attrs.verticalLine = verticalLine;
     return this;
@@ -243,8 +252,10 @@ export class CdfChartD3 {
       .attr('transform', 'translate(0,' + this.calc.chartHeight + ')')
       .call(xAxis);
 
-    this.chart.createObject({ tag: 'g', selector: 'y-axis' })
-      .call(yAxis);
+    if (this.attrs.showDistributionYAxis) {
+      this.chart.createObject({ tag: 'g', selector: 'y-axis' })
+        .call(yAxis);
+    }
 
     // Draw area.
     this.chart

src/components/charts/cdfChartReact.js

@@ -45,6 +45,7 @@ function CdfChartReact(props) {
       .marginRight(5)
       .marginTop(5)
       .showDistributionLines(props.showDistributionLines)
+      .showDistributionYAxis(props.showDistributionYAxis)
       .verticalLine(props.verticalLine)
       .showVerticalLine(props.showVerticalLine)
       .container(containerRef.current)