diff --git a/src/components/TraceTree/d3-trace.js b/src/components/TraceTree/d3-trace.js
index 9c795e7..8f0461b 100644
--- a/src/components/TraceTree/d3-trace.js
+++ b/src/components/TraceTree/d3-trace.js
@@ -19,7 +19,7 @@
 import * as d3 from 'd3';
 import d3tip from 'd3-tip';
 export default class TraceMap {
-  constructor(el, showSpanModal,smax,smin,cmax,cmin) {
+  constructor(el,row, showSpanModal,smax,smin,cmax,cmin) {
     this.type = {
       MQ: '#bf99f8',
       Http: '#72a5fd',
@@ -37,9 +37,10 @@
     this.i = 0;
     this.j = 0;
     this.width = el.clientWidth;
-    this.height = el.clientHeight;
+    this.height = (row.length - 1) * 80;
     this.body = d3
       .select(this.el)
+      .style('height', this.height + 'px')
       .append('svg')
       .attr('width', this.width)
       .attr('height', this.height);
@@ -53,7 +54,7 @@
       .html(d => d.data.label);
     this.body.call(this.timeTip);
     this.body.call(this.tip);
-    this.treemap = d3.tree().size([this.height * 0.7, this.width]);
+    this.treemap = d3.tree().size([this.height * 0.8, this.width]);
   }
   init(data, row) {
     this.row = row;
@@ -65,7 +66,7 @@
       .scaleSequential()
       .domain([0, this.list.length])
       .interpolator(d3.interpolateCool);
-    this.svg = this.body.append('g').attr('transform', d => `translate(0, ${this.row.length * 10})`).append('g');
+    this.svg = this.body.append('g').attr('transform', d => `translate(0, ${this.row.length * 14})`).append('g');
     this.timeGroup = this.body.append('g').attr('class','timeGroup').attr('transform', d => 'translate(5,30)');
     this.body.call(this.getZoomBehavior(this.svg));
     this.root = d3.hierarchy(this.data, d => d.children);
diff --git a/src/components/TraceTree/index.js b/src/components/TraceTree/index.js
index 6e740ea..278b1d8 100644
--- a/src/components/TraceTree/index.js
+++ b/src/components/TraceTree/index.js
@@ -118,7 +118,7 @@
 
     this.topChildMax = this.topChild.sort((a,b) => b - a)[0];
     this.topChildMin = this.topChild.sort((a,b) => b - a)[4];
-    this.tree = new Tree(this.echartsElement, propsData.showSpanModal, this.topSlowMax,this.topSlowMin,this.topChildMax,this.topChildMin)
+    this.tree = new Tree(this.echartsElement,rowData, propsData.showSpanModal, this.topSlowMax,this.topSlowMin,this.topChildMax,this.topChildMin)
     this.tree.init({label:`${this.traceId}`, children: this.segmentId}, rowData);
     this.tree.draw();
     this.resize = this.tree.resize.bind(this.tree);
@@ -158,10 +158,6 @@
   }
   
   render() {
-    const newStyle = {
-      height: 800,
-      // ...style,
-    };
     return (
       <div>
         <ButtonGroup>
@@ -178,7 +174,6 @@
         </div>
         <div
           ref={(e) => { this.echartsElement = e; }}
-          style={newStyle}
           className="trace-tree"
         />
       </div>
diff --git a/src/components/TraceTree/style.less b/src/components/TraceTree/style.less
index 5924b85..1ed35c4 100644
--- a/src/components/TraceTree/style.less
+++ b/src/components/TraceTree/style.less
@@ -15,9 +15,6 @@
  * limitations under the License.
  */
 
-:global(.trace-tree) {
-  height: 1000px;
-}
 :global(.trace-tree .node) {
   cursor: pointer;
 }