AuroraMiddleware/v8
1
0
Fork 0
Code Issues 2 Pull Requests Releases Wiki Activity

[turbofan] Refactor graph width

Browse Source 
Graph width is now managed by the Graph instead of the GraphView,
which simplifies some interfaces.

Change-Id: If78bc9a469cc8369bc75695a6612627103036bc8
Notry: true
Bug: v8:7327
Reviewed-on: https://chromium-review.googlesource.com/c/1398227
Reviewed-by: Georg Neis <neis@chromium.org>
Commit-Queue: Sigurd Schneider <sigurds@chromium.org>
Cr-Commit-Position: refs/heads/master@{#58618}
This commit is contained in:
Sigurd Schneider 2019-01-07 19:40:00 +01:00 committed by Commit Bot
parent 5a9fa8f304
commit 874ae8a459
2 changed files with 16 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
tools/turbolizer/src/graph-view.ts
View File

@ -37,8 +37,6 @@ export class GraphView extends View implements PhaseView {
graphElement: d3.Selection<any, any, any, any>; graphElement: d3.Selection<any, any, any, any>;
visibleNodes: d3.Selection<any, GNode, any, any>; visibleNodes: d3.Selection<any, GNode, any, any>;
visibleEdges: d3.Selection<any, Edge, any, any>; visibleEdges: d3.Selection<any, Edge, any, any>;
width: number;
height: number;
drag: d3.DragBehavior<any, GNode, GNode>; drag: d3.DragBehavior<any, GNode, GNode>;
panZoom: d3.ZoomBehavior<SVGElement, any>; panZoom: d3.ZoomBehavior<SVGElement, any>;
visibleBubbles: d3.Selection<any, any, any, any>; visibleBubbles: d3.Selection<any, any, any, any>;
@ -547,9 +545,7 @@ export class GraphView extends View implements PhaseView {
layoutGraph() { layoutGraph() {
console.time("layoutGraph"); console.time("layoutGraph");
layoutNodeGraph(this.graph, this.state.showTypes); layoutNodeGraph(this.graph, this.state.showTypes);
const [[width, height], extent] = this.graph.redetermineGraphBoundingBox(this.state.showTypes); const extent = this.graph.redetermineGraphBoundingBox(this.state.showTypes);
this.width = width;
this.height = height;
this.panZoom.translateExtent(extent); this.panZoom.translateExtent(extent);
this.minScale(); this.minScale();
console.timeEnd("layoutGraph"); console.timeEnd("layoutGraph");
@ -802,10 +798,9 @@ export class GraphView extends View implements PhaseView {
} }
minScale() { minScale() {
const view = this;
const dimensions = this.getSvgViewDimensions(); const dimensions = this.getSvgViewDimensions();
const minXScale = dimensions[0] / (2 * view.width); const minXScale = dimensions[0] / (2 * this.graph.width);
const minYScale = dimensions[1] / (2 * view.height); const minYScale = dimensions[1] / (2 * this.graph.height);
const minScale = Math.min(minXScale, minYScale); const minScale = Math.min(minXScale, minYScale);
this.panZoom.scaleExtent([minScale, 40]); this.panZoom.scaleExtent([minScale, 40]);
return minScale; return minScale;
@ -862,6 +857,8 @@ export class GraphView extends View implements PhaseView {
viewWholeGraph() { viewWholeGraph() {
this.panZoom.scaleTo(this.svg, 0); this.panZoom.scaleTo(this.svg, 0);
this.panZoom.translateTo(this.svg, this.graph.minGraphX + this.width / 2, this.graph.minGraphY + this.height / 2) this.panZoom.translateTo(this.svg,
this.graph.minGraphX + this.graph.width / 2,
this.graph.minGraphY + this.graph.height / 2)
} }
} }

16
tools/turbolizer/src/graph.ts
View File

@ -9,6 +9,8 @@ export class Graph {
maxGraphY: number; maxGraphY: number;
maxGraphNodeX: number; maxGraphNodeX: number;
maxBackEdgeNumber: number; maxBackEdgeNumber: number;
width: number;
height: number;
constructor(data: any) { constructor(data: any) {
this.nodeMap = []; this.nodeMap = [];
@ -17,6 +19,8 @@ export class Graph {
this.maxGraphX = 1; this.maxGraphX = 1;
this.minGraphY = 0; this.minGraphY = 0;
this.maxGraphY = 1; this.maxGraphY = 1;
this.width = 1;
this.height = 1;
data.nodes.forEach((json_node: any) => { data.nodes.forEach((json_node: any) => {
this.nodeMap[json_node.id] = new GNode(json_node.nodeLabel); this.nodeMap[json_node.id] = new GNode(json_node.nodeLabel);
@ -60,7 +64,7 @@ export class Graph {
} }
} }
redetermineGraphBoundingBox(showTypes: boolean): [[number, number], [[number, number], [number, number]]] { redetermineGraphBoundingBox(showTypes: boolean): [[number, number], [number, number]] {
this.minGraphX = 0; this.minGraphX = 0;
this.maxGraphNodeX = 1; this.maxGraphNodeX = 1;
this.maxGraphX = undefined; // see below this.maxGraphX = undefined; // see below
@ -89,15 +93,15 @@ export class Graph {
this.maxGraphX = this.maxGraphNodeX + this.maxGraphX = this.maxGraphNodeX +
this.maxBackEdgeNumber * MINIMUM_EDGE_SEPARATION; this.maxBackEdgeNumber * MINIMUM_EDGE_SEPARATION;
const width = (this.maxGraphX - this.minGraphX); this.width = this.maxGraphX - this.minGraphX;
const height = this.maxGraphY - this.minGraphY; this.height = this.maxGraphY - this.minGraphY;
const extent: [[number, number], [number, number]] = [ const extent: [[number, number], [number, number]] = [
[this.minGraphX - width / 2, this.minGraphY - height / 2], [this.minGraphX - this.width / 2, this.minGraphY - this.height / 2],
[this.maxGraphX + width / 2, this.maxGraphY + height / 2] [this.maxGraphX + this.width / 2, this.maxGraphY + this.height / 2]
]; ];
return [[width, height], extent]; return extent;
} }
} }