Adds discrete param

This commit is contained in:
Roman Galochkin 2020-02-20 12:53:56 +03:00
parent 4e0ce7ad02
commit dd18736258
4 changed files with 33 additions and 10 deletions

View File

@ -1,11 +1,19 @@
[@bs.module "./cdfChartReact.js"] [@bs.module "./cdfChartReact.js"]
external cdfChart: ReasonReact.reactClass = "default"; external cdfChart: ReasonReact.reactClass = "default";
type primaryDistribution = { type primaryDistribution =
. option({
"xs": array(float), .
"ys": array(float), "xs": array(float),
}; "ys": array(float),
});
type discrete =
option({
.
"xs": array(float),
"ys": array(float),
});
[@react.component] [@react.component]
let make = let make =
@ -17,6 +25,7 @@ let make =
~minX=?, ~minX=?,
~onHover=(f: float) => (), ~onHover=(f: float) => (),
~primaryDistribution=?, ~primaryDistribution=?,
~discrete=?,
~scale=?, ~scale=?,
~showDistributionLines=?, ~showDistributionLines=?,
~showVerticalLine=?, ~showVerticalLine=?,
@ -35,6 +44,7 @@ let make =
~minX?, ~minX?,
~onHover, ~onHover,
~primaryDistribution?, ~primaryDistribution?,
~discrete?,
~scale?, ~scale?,
~showDistributionLines?, ~showDistributionLines?,
~showVerticalLine?, ~showVerticalLine?,

View File

@ -27,7 +27,8 @@ module Styles = {
let make = let make =
( (
~color=`hex("111"), ~color=`hex("111"),
~data, ~primaryDistribution=?,
~discrete=?,
~height=200, ~height=200,
~maxX=?, ~maxX=?,
~minX=?, ~minX=?,
@ -45,7 +46,10 @@ let make =
marginBottom=50 marginBottom=50
marginTop=0 marginTop=0
onHover onHover
primaryDistribution={data |> Shape.XYShape.toJs} primaryDistribution={
primaryDistribution |> E.O.fmap(pd => pd |> Shape.XYShape.toJs)
}
discrete={discrete |> E.O.fmap(d => d |> Shape.Discrete.toJs)}
showDistributionLines=false showDistributionLines=false
showVerticalLine=false showVerticalLine=false
/> />

View File

@ -7,11 +7,12 @@ module Mixed = {
React.useMemo1( React.useMemo1(
() => () =>
<CdfChart__Plain <CdfChart__Plain
data={ primaryDistribution={
data.continuous data.continuous
|> Shape.Continuous.normalizePdf |> Shape.Continuous.normalizePdf
|> E.O.toExt("") |> E.O.toExt("")
} }
discrete={data.discrete}
color={`hex("333")} color={`hex("333")}
timeScale timeScale
onHover={r => setX(_ => r)} onHover={r => setX(_ => r)}
@ -70,7 +71,12 @@ module Cont = {
let make = (~continuous, ~onHover, ~timeScale) => { let make = (~continuous, ~onHover, ~timeScale) => {
let chart = let chart =
React.useMemo1( React.useMemo1(
() => <CdfChart__Plain data=continuous color={`hex("333")} onHover />, () =>
<CdfChart__Plain
primaryDistribution=continuous
color={`hex("333")}
onHover
/>,
[|continuous|], [|continuous|],
); );
chart; chart;

View File

@ -48,7 +48,10 @@ function CdfChartReact(props) {
.verticalLine(props.verticalLine) .verticalLine(props.verticalLine)
.showVerticalLine(props.showVerticalLine) .showVerticalLine(props.showVerticalLine)
.container(containerRef.current) .container(containerRef.current)
.data({ primary: props.primaryDistribution }) .data({
primary: props.primaryDistribution,
discrete: props.discrete,
})
.scale(scale) .scale(scale)
.timeScale(props.timeScale) .timeScale(props.timeScale)
.render(); .render();