diff --git a/src/views/components/topology/topo-aside.vue b/src/views/components/topology/topo-aside.vue
index f38ce15..c36d8f7 100644
--- a/src/views/components/topology/topo-aside.vue
+++ b/src/views/components/topology/topo-aside.vue
@@ -147,6 +147,7 @@
         size="75%"
         destroy-on-close
         :visible.sync="stateTopo.showAlarmDialog"
+        :modal-append-to-body="false"
     >
       <alarm-containers :style="`height: ${drawerMainBodyHeight}`"
                         :alarmScope="{label: 'Service', key: 'Service'}"
@@ -160,6 +161,7 @@
         size="75%"
         destroy-on-close
         :visible.sync="stateTopo.showTraceDialog"
+        :modal-append-to-body="false"
     >
       <trace-containers :style="`height: ${drawerMainBodyHeight}`"
                         :service="{label: stateTopo.honeycombNode.name, key: stateTopo.honeycombNode.id}"
diff --git a/src/views/components/topology/topo.vue b/src/views/components/topology/topo.vue
index 351d8da..c9bb4f5 100644
--- a/src/views/components/topology/topo.vue
+++ b/src/views/components/topology/topo.vue
@@ -140,11 +140,6 @@
     'datas.nodes': 'draw',
   },
   methods: {
-   switchNativeContextMenu(enable) {
-    document.oncontextmenu = () => {
-     return enable;
-    };
-   },
    removeHoneycomb(that) {
     const appGovernTopoHoneycombFrames = d3.select('#app-govern-topo-honeycomb-frames');
     appGovernTopoHoneycombFrames.nodes().forEach((node) => {
@@ -158,7 +153,6 @@
     });
     setTimeout(() => {
      appGovernTopoHoneycombFrames.remove();
-     that.switchNativeContextMenu(true);
     }, 780);
    },
     draw(value, oldValue) {
@@ -226,23 +220,42 @@
         .on('mouseover', function(d, i) {
            that.tipName.show(d, this);
         })
-          .on('contextmenu', function (d) {
-           if (d.isReal) {
+        .on('mouseout', function(d, i) {
+          that.tipName.hide(d, this);
+        })
+        .on('click', function(d, i) {
+          event.stopPropagation();
+          that.tip.hide({}, this);
+          that.node.attr('class', '');
+          d3.select(this).attr('class', 'node-active');
+          const copyD = JSON.parse(JSON.stringify(d));
+          delete copyD.x;
+          delete copyD.y;
+          delete copyD.vx;
+          delete copyD.vy;
+          delete copyD.fx;
+          delete copyD.fy;
+          delete copyD.index;
+          that.$store.dispatch('rocketTopo/CLEAR_TOPO_INFO');
+          that.$store.commit('rocketTopo/SET_NODE', copyD);
+          that.toggleNode(that.node, d, true);
+          that.toggleLine(that.line, d, true);
+          that.toggleLine(that.lineNode, d, true);
+          if (d.isReal) {
             const honeycombFrames = d3.select('#honeycomb-selector_honeycomb-frames');
             const appGovernTopoHoneycombFrames = that.graph.append('g')
-                .attr('id', 'app-govern-topo-honeycomb-frames')
-                .attr('style', honeycombFrames.attr('style'))
-                .attr('stroke', honeycombFrames.attr('stroke')).html(honeycombFrames.html())
-                .on('mouseleave', function () {
-                 that.removeHoneycomb(that);
-                });
+              .attr('id', 'app-govern-topo-honeycomb-frames')
+              .attr('style', honeycombFrames.attr('style'))
+              .attr('stroke', honeycombFrames.attr('stroke')).html(honeycombFrames.html())
+              .on('mouseleave', function () {
+                that.removeHoneycomb(that);
+              });
             const nodeTranslate = CssHelper.translateSerialization(this.getAttribute('transform'));
             const appGovernTopoHoneycombFramesTranslate = CssHelper.matrixSerialization(honeycombFrames.attr('transform'));
             appGovernTopoHoneycombFramesTranslate.tx = nodeTranslate.x - 83;
             appGovernTopoHoneycombFramesTranslate.ty = nodeTranslate.y + 72;
             appGovernTopoHoneycombFrames.attr('transform', CssHelper.matrixDeserialization(appGovernTopoHoneycombFramesTranslate));
 
-            that.switchNativeContextMenu(false);
             that.$store.commit('rocketTopo/SET_HONEYCOMB_NODE', d);
 
             d3.selectAll('#honeycomb-selector_honeycomb-group-top-right').on('click', () => {
@@ -263,29 +276,7 @@
              that.$store.commit('rocketTopo/SET_SHOW_ENDPOINT_DIALOG', true);
              that.removeHoneycomb(that);
             });
-           }
-          })
-        .on('mouseout', function(d, i) {
-          that.tipName.hide(d, this);
-        })
-        .on('click', function(d, i) {
-          event.stopPropagation();
-          that.tip.hide({}, this);
-          that.node.attr('class', '');
-          d3.select(this).attr('class', 'node-active');
-          const copyD = JSON.parse(JSON.stringify(d));
-          delete copyD.x;
-          delete copyD.y;
-          delete copyD.vx;
-          delete copyD.vy;
-          delete copyD.fx;
-          delete copyD.fy;
-          delete copyD.index;
-         that.$store.dispatch('rocketTopo/CLEAR_TOPO_INFO');
-         that.$store.commit('rocketTopo/SET_NODE', copyD);
-          that.toggleNode(that.node, d, true);
-          that.toggleLine(that.line, d, true);
-          that.toggleLine(that.lineNode, d, true);
+          }
         });
       this.node
         .append('image')
diff --git a/src/views/containers/endpoint-survey-window.vue b/src/views/containers/endpoint-survey-window.vue
index 6a86585..c699735 100644
--- a/src/views/containers/endpoint-survey-window.vue
+++ b/src/views/containers/endpoint-survey-window.vue
@@ -20,6 +20,7 @@
     <el-drawer
       :destroy-on-close="true"
       :visible.sync="isShowSync"
+      :modal-append-to-body="false"
       direction="rtl"
       size="80%">
       <div class="rk-dashboard-bar flex-h">
diff --git a/src/views/containers/instances-survey-window.vue b/src/views/containers/instances-survey-window.vue
index ed6d767..bd17a05 100644
--- a/src/views/containers/instances-survey-window.vue
+++ b/src/views/containers/instances-survey-window.vue
@@ -22,6 +22,7 @@
       title="Instances"
       :visible.sync="isShowSync"
       direction="rtl"
+      :modal-append-to-body="false"
       size="80%">
       <div class="rk-dashboard-bar flex-h">
         <ToolBarSelect