mirror of
https://github.com/chanzuckerberg/cellxgene.git
synced 2026-09-18 06:17:59 +08:00
d4e850d18f
* mocks for redux refactor - for discussion * more API design on redux refactor * add new reuqired dependencies for build * change babel target to use modern browser * remove dead code * remove dead code - joy plots * checkpoint on redux refactoring * checkpoint on redux refactoring * fix mistaken rebase conflict resolution * dead code removal; add name to dataframe backmap * rename dataframe to universe * update eslint config to more closely match prettier * lint * more eslint updates to match prettier * additional config to make eslint match prettier * add expression data to Universe/World * remove obsolete reducers * lint fixes * more eslint cleanup * lint * lint * fix but in countAllOnes when dimensions gt 1 * lint; do not display name metadata field * lint; colors refactor * lint; colors refactor * update comments * first cut at regraph and reset * enable object-curly-braces consistent mode * lint, handle regraph with no selection * fix expression scatterplot bugs * fix regression legend display * add expression data cache * remove console logging * reset cell color on regraph/reset * remove obsolete server URLs * rename UniverseV01 to Universe_REST_API_v01 * add additional comments on the varDataCache * merge universe reducer into controls reducer; simplify initialization-related actions * use spread operator * fix erroneous comment * convert universe and world state to plain objects, and functionalize supporting code (remove ES6 classes) * use spread operator * lint * improve variable names * rename obsCrossfilter to crossfilter and obsDimensionMap to dimensionMap * rename controls2 to controls
80 lines
2.0 KiB
JavaScript
80 lines
2.0 KiB
JavaScript
// jshint esversion: 6
|
|
/* rc slider https://www.npmjs.com/package/rc-slider */
|
|
|
|
import React from "react";
|
|
import _ from "lodash";
|
|
import { connect } from "react-redux";
|
|
|
|
import styles from "./parallelCoordinates.css";
|
|
import SectionHeader from "../framework/sectionHeader";
|
|
|
|
import setupParallelCoordinates from "./setupParallelCoordinates";
|
|
import drawAxes from "./drawAxes";
|
|
import drawLinesCanvas from "./drawLinesCanvas";
|
|
|
|
import HistogramBrush from "./histogramBrush";
|
|
|
|
import { margin, width, height, createDimensions } from "./util";
|
|
|
|
@connect(state => {
|
|
const metadata = _.get(state.controls.world, "obsAnnotations", null);
|
|
const ranges = _.get(state.controls.world, "summary.obs", null);
|
|
|
|
return {
|
|
ranges,
|
|
metadata,
|
|
colorAccessor: state.controls.colorAccessor,
|
|
colorScale: state.controls.colorScale,
|
|
selectionUpdate: _.get(state.controls, "crossfilter.updateTime", null)
|
|
};
|
|
})
|
|
class Continuous extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
svg: null,
|
|
ctx: null,
|
|
axes: null,
|
|
dimensions: null
|
|
};
|
|
}
|
|
|
|
handleBrushAction(selection) {
|
|
this.props.dispatch({
|
|
type: "continuous selection using parallel coords brushing",
|
|
data: selection
|
|
});
|
|
}
|
|
|
|
handleColorAction(key) {
|
|
this.props.dispatch({
|
|
type: "color by continuous metadata",
|
|
colorAccessor: key,
|
|
rangeMaxForColorAccessor: this.props.ranges[key].range.max
|
|
});
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
{_.map(this.props.ranges, (value, key) => {
|
|
const isColorField = key.includes("color") || key.includes("Color");
|
|
if (value.range && key !== "name" && !isColorField) {
|
|
return (
|
|
<HistogramBrush
|
|
key={key}
|
|
metadataField={key}
|
|
ranges={value.range}
|
|
/>
|
|
);
|
|
}
|
|
})}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default Continuous;
|
|
|
|
// <SectionHeader text="Continuous Metadata"/>
|