Merge pull request #18 from foretold-app/improvements/1103
Improvements/1103
This commit is contained in:
commit
e71a3ad1b3
|
@ -4,9 +4,14 @@ const moment = require('moment');
|
||||||
require('./styles.css');
|
require('./styles.css');
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @todo: To rename as "DistPlotD3".
|
* @param arr
|
||||||
|
* @returns {*}
|
||||||
*/
|
*/
|
||||||
export class CdfChartD3 {
|
function exists(arr) {
|
||||||
|
return arr.find(num => _.isFinite(num));
|
||||||
|
}
|
||||||
|
|
||||||
|
export class DistPlotD3 {
|
||||||
|
|
||||||
constructor() {
|
constructor() {
|
||||||
this.attrs = {
|
this.attrs = {
|
||||||
|
@ -178,15 +183,27 @@ export class CdfChartD3 {
|
||||||
*/
|
*/
|
||||||
getCommonThings() {
|
getCommonThings() {
|
||||||
// Boundaries.
|
// Boundaries.
|
||||||
const xMin = this.attrs.minX
|
const xMin = exists([
|
||||||
|| d3.min(this.attrs.data.continuous.xs)
|
this.attrs.minX,
|
||||||
|| d3.min(this.attrs.data.discrete.xs);
|
d3.min(this.attrs.data.continuous.xs),
|
||||||
const xMax = this.attrs.maxX
|
d3.min(this.attrs.data.discrete.xs),
|
||||||
|| d3.max(this.attrs.data.continuous.xs)
|
]);
|
||||||
|| d3.max(this.attrs.data.discrete.xs);
|
const xMax = exists([
|
||||||
|
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 yMin = exists([
|
||||||
const yMax = d3.max(this.attrs.data.continuous.ys);
|
this.attrs.minY,
|
||||||
|
d3.min(this.attrs.data.continuous.ys),
|
||||||
|
d3.min(this.attrs.data.discrete.ys),
|
||||||
|
]);
|
||||||
|
const yMax = exists([
|
||||||
|
this.attrs.maxY,
|
||||||
|
d3.max(this.attrs.data.continuous.ys),
|
||||||
|
d3.max(this.attrs.data.discrete.ys),
|
||||||
|
]);
|
||||||
|
|
||||||
// Errors.
|
// Errors.
|
||||||
if (!_.isFinite(xMin)) throw new Error('xMin is undefined');
|
if (!_.isFinite(xMin)) throw new Error('xMin is undefined');
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import React, { useEffect } from 'react';
|
import React, { useEffect } from 'react';
|
||||||
import { useSize } from 'react-use';
|
import { useSize } from 'react-use';
|
||||||
import { CdfChartD3 } from './distPlotD3';
|
import { DistPlotD3 } from './distPlotD3';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @param min
|
* @param min
|
||||||
|
@ -14,12 +14,11 @@ function getRandomInt(min, max) {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @todo: To rename as "DistPlotReact".
|
|
||||||
* @param props
|
* @param props
|
||||||
* @returns {*}
|
* @returns {*}
|
||||||
* @constructor
|
* @constructor
|
||||||
*/
|
*/
|
||||||
function CdfChartReact(props) {
|
function DistPlotReact(props) {
|
||||||
const containerRef = React.createRef();
|
const containerRef = React.createRef();
|
||||||
const key = "cdf-chart-react-" + getRandomInt(0, 1000);
|
const key = "cdf-chart-react-" + getRandomInt(0, 1000);
|
||||||
const scale = props.scale || 'linear';
|
const scale = props.scale || 'linear';
|
||||||
|
@ -35,7 +34,7 @@ function CdfChartReact(props) {
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
try {
|
try {
|
||||||
new CdfChartD3()
|
new DistPlotD3()
|
||||||
.set('svgWidth', width)
|
.set('svgWidth', width)
|
||||||
.set('svgHeight', props.height)
|
.set('svgHeight', props.height)
|
||||||
.set('maxX', props.maxX)
|
.set('maxX', props.maxX)
|
||||||
|
@ -79,4 +78,4 @@ function CdfChartReact(props) {
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
export default CdfChartReact;
|
export default DistPlotReact;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user