fix: resize

This commit is contained in:
Fine 2024-01-22 15:25:36 +08:00
parent f76500bb6e
commit dd1fb8a14b
2 changed files with 4 additions and 12 deletions

View File

@ -42,6 +42,7 @@ export default class ListGraph {
private xAxis: any = null; private xAxis: any = null;
private sequentialScale: any = null; private sequentialScale: any = null;
private root: any = null; private root: any = null;
private fixSpansSize: number = 0;
constructor(el: HTMLDivElement, handleSelectSpan: (i: Trace) => void) { constructor(el: HTMLDivElement, handleSelectSpan: (i: Trace) => void) {
this.handleSelectSpan = handleSelectSpan; this.handleSelectSpan = handleSelectSpan;
this.el = el; this.el = el;
@ -87,6 +88,7 @@ export default class ListGraph {
d3.select(".trace-xaxis").remove(); d3.select(".trace-xaxis").remove();
this.row = row; this.row = row;
this.data = data; this.data = data;
this.fixSpansSize = fixSpansSize;
this.min = d3.min(this.row.map((i) => i.startTime)); this.min = d3.min(this.row.map((i) => i.startTime));
this.max = d3.max(this.row.map((i) => i.endTime - this.min)) || 0; this.max = d3.max(this.row.map((i) => i.endTime - this.min)) || 0;
this.list = Array.from(new Set(this.row.map((i) => i.serviceCode))); this.list = Array.from(new Set(this.row.map((i) => i.serviceCode)));
@ -388,11 +390,6 @@ export default class ListGraph {
if (!this.el) { if (!this.el) {
return; return;
} }
this.width = this.el.getBoundingClientRect().width - 20; this.init(this.data, this.row, this.fixSpansSize);
this.height = this.el.getBoundingClientRect().height - 10;
this.svg.attr("width", this.width).attr("height", this.height);
this.svg.select("g").attr("transform", () => `translate(160, 0)`);
const transform = d3.zoomTransform(this.svg).translate(0, 0);
d3.zoom().transform(this.svg, transform);
} }
} }

View File

@ -82,12 +82,7 @@ export default class TraceMap {
if (!this.el) { if (!this.el) {
return; return;
} }
this.width = this.el.clientWidth; this.init(this.data, this.row);
this.height = this.el.clientHeight + 100;
this.body.attr("width", this.width).attr("height", this.height);
this.body.select("g").attr("transform", () => `translate(160, 0)`);
const transform = d3.zoomTransform(this.body).translate(0, 0);
d3.zoom().transform(this.body, transform);
} }
init(data: Recordable, row: Recordable) { init(data: Recordable, row: Recordable) {
this.treemap = d3.tree().size([row.length * 35, this.width]); this.treemap = d3.tree().size([row.length * 35, this.width]);