fork/cellxgene
1
0
Fork 0
mirror of https://github.com/chanzuckerberg/cellxgene.git synced 2026-10-03 22:18:12 +08:00
Code Issues Packages Projects Releases Wiki Activity

turn brush back on, with bugs...

Browse Source
This commit is contained in:
Colin Megill
2018-04-19 14:54:36 -07:00
parent 56a691e307
commit 31c4f54570
2 changed files with 20 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/graph/graph.js
+16 -15
View File
@@ -19,11 +19,6 @@ import {
/* https://bl.ocks.org/mbostock/9078690 - quadtree for onClick / hover selections */ /* https://bl.ocks.org/mbostock/9078690 - quadtree for onClick / hover selections */
// set constants
const count = 39746
@connect((state) => { @connect((state) => {
const vertices = state.cells.cells && state.cells.cells.data.graph ? state.cells.cells.data.graph : null; const vertices = state.cells.cells && state.cells.cells.data.graph ? state.cells.cells.data.graph : null;
@@ -56,11 +51,13 @@ class Graph extends React.Component {
}; };
} }
componentDidMount() { componentDidMount() {
// const {svg, ctx} = setupGraphElements( const {
// this.handleBrushSelectAction.bind(this), svg
// this.handleBrushDeselectAction.bind(this) } = setupGraphElements(
// ); this.handleBrushSelectAction.bind(this),
// this.setState({svg, ctx}); this.handleBrushDeselectAction.bind(this)
);
this.setState({svg});
// setup canvas and camera // setup canvas and camera
const camera = _camera(this.reglCanvas, {scale: true, rotate: false}); const camera = _camera(this.reglCanvas, {scale: true, rotate: false});
@@ -133,9 +130,13 @@ class Graph extends React.Component {
const colors = []; const colors = [];
const sizes = []; const sizes = [];
const s = d3.scaleLinear() const glScaleX = d3.scaleLinear()
.domain([0,1]) .domain([0,1])
.range([-.95, .95]) /* padding */ .range([-1, 1]) /* padding */
const glScaleY = d3.scaleLinear()
.domain([0,1])
.range([1, -1]) /* padding */
/* /*
Construct Vectors Construct Vectors
@@ -143,8 +144,8 @@ class Graph extends React.Component {
_.each(nextProps.currentCellSelection, (cell, i) => { _.each(nextProps.currentCellSelection, (cell, i) => {
if (nextProps.graphMap[cell["CellName"]]) { /* fails silently, sometimes this is undefined, in which case the graph array should be shorter than the cell array, check in reducer */ if (nextProps.graphMap[cell["CellName"]]) { /* fails silently, sometimes this is undefined, in which case the graph array should be shorter than the cell array, check in reducer */
positions.push([ positions.push([
s(nextProps.graphMap[cell["CellName"]][0]), glScaleX(nextProps.graphMap[cell["CellName"]][0]),
s(nextProps.graphMap[cell["CellName"]][1]) glScaleY(nextProps.graphMap[cell["CellName"]][1])
]) ])
let c = cell["__color__"]; let c = cell["__color__"];
@@ -260,7 +261,7 @@ class Graph extends React.Component {
> >
</div> </div>
<div style={{padding: 0, margin: 0}}> <div style={{padding: 0, margin: 0}}>
<canvas width={960} height={960} ref={(canvas) => { this.reglCanvas = canvas}}/> <canvas width={globals.graphWidth} height={globals.graphHeight} ref={(canvas) => { this.reglCanvas = canvas}}/>
</div> </div>
</div> </div>
) )
src/globals.js
+4 -2
View File
@@ -58,8 +58,10 @@ export const maxParagraphWidth = 600;
export const maxControlsWidth = 800; export const maxControlsWidth = 800;
export const graphMargin = {top: 20, right: 10, bottom: 30, left: 40}; export const graphMargin = {top: 20, right: 10, bottom: 30, left: 40};
export const graphWidth = 1440 /* window width */ - 410 /* sidebar */ - (15 + 15) /* left right padding */ /* but responsive */; // export const graphWidth = 1440 /* window width */ - 410 /* sidebar */ - (15 + 15) /* left right padding */ /* but responsive */;
export const graphHeight = 500; // export const graphHeight = 500;
export const graphWidth = 960;
export const graphHeight = 960;
export const graphXScale = d3.scaleLinear() export const graphXScale = d3.scaleLinear()
.domain([0, 1]) /* while this is the default for d3, our data is normalized so better to be explicit */ .domain([0, 1]) /* while this is the default for d3, our data is normalized so better to be explicit */