This commit is contained in:
Colin Megill
2018-05-01 23:08:25 -07:00
parent af09276951
commit 7dc61d3370
+39 -49
View File
@@ -1,10 +1,10 @@
/* rc slider https://www.npmjs.com/package/rc-slider */
import React from 'react';
import React from "react";
import _ from "lodash";
import { connect } from "react-redux";
import styles from './parallelCoordinates.css';
import styles from "./parallelCoordinates.css";
import SectionHeader from "../framework/sectionHeader";
import setupParallelCoordinates from "./setupParallelCoordinates";
@@ -13,19 +13,22 @@ import drawLinesCanvas from "./drawLinesCanvas";
import HistogramBrush from "./histogramBrush";
import {
margin,
width,
height,
createDimensions,
} from "./util";
import { margin, width, height, createDimensions } from "./util";
@connect((state) => {
@connect(state => {
const ranges =
state.cells.cells && state.cells.cells.data.ranges
? state.cells.cells.data.ranges
: null;
const metadata =
state.cells.cells && state.cells.cells.data.metadata
? state.cells.cells.data.metadata
: null;
const ranges = state.cells.cells && state.cells.cells.data.ranges ? state.cells.cells.data.ranges : null;
const metadata = state.cells.cells && state.cells.cells.data.metadata ? state.cells.cells.data.metadata : null;
const initializeRanges = state.initialize.data && state.initialize.data.data.ranges ? state.initialize.data.data.ranges : null;
const initializeRanges =
state.initialize.data && state.initialize.data.data.ranges
? state.initialize.data.data.ranges
: null;
return {
ranges,
@@ -35,8 +38,8 @@ import {
colorScale: state.controls.colorScale,
graphBrushSelection: state.controls.graphBrushSelection,
currentCellSelection: state.controls.currentCellSelection,
axesHaveBeenDrawn: state.controls.axesHaveBeenDrawn,
}
axesHaveBeenDrawn: state.controls.axesHaveBeenDrawn
};
})
class Continuous extends React.Component {
constructor(props) {
@@ -45,26 +48,20 @@ class Continuous extends React.Component {
svg: null,
ctx: null,
axes: null,
dimensions: null,
dimensions: null
};
}
componentDidMount() {
componentDidMount() {}
componentWillReceiveProps(nextProps) {}
}
componentWillReceiveProps(nextProps) {
}
componentDidMount() {
}
handleBrushAction (selection) {
componentDidMount() {}
handleBrushAction(selection) {
this.props.dispatch({
type: "continuous selection using parallel coords brushing",
data: selection
})
});
}
handleColorAction (key) {
handleColorAction(key) {
this.props.dispatch({
type: "color by continuous metadata",
colorAccessor: key,
@@ -73,32 +70,25 @@ class Continuous extends React.Component {
}
render() {
return (
<div>
{
_.map(this.props.ranges, (value, key) => {
const isColorField = key.includes("color") || key.includes("Color");
if (
value.range &&
key !== "CellName" &&
!isColorField
) {
return (
<HistogramBrush
key={key}
metadataField={key}
ranges={value.range}/>
)
}
})
}
{_.map(this.props.ranges, (value, key) => {
const isColorField = key.includes("color") || key.includes("Color");
if (value.range && key !== "CellName" && !isColorField) {
return (
<HistogramBrush
key={key}
metadataField={key}
ranges={value.range}
/>
);
}
})}
</div>
)
);
}
};
}
export default Continuous;
// <SectionHeader text="Continuous Metadata"/>