From feb662068c68b02e6d6ea23747ff14d32660c9d7 Mon Sep 17 00:00:00 2001
From: wenzhijie <wenzhijie@geedgenetworks.com>
Date: Thu, 11 Aug 2022 11:17:35 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9lenged=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/chart/chart/chartTreemapD3.vue | 21 +++++++++++++++----
 1 file changed, 17 insertions(+), 4 deletions(-)

diff --git a/nezha-fronted/src/components/chart/chart/chartTreemapD3.vue b/nezha-fronted/src/components/chart/chart/chartTreemapD3.vue
index 3d2fefb16..a2f127c20 100644
--- a/nezha-fronted/src/components/chart/chart/chartTreemapD3.vue
+++ b/nezha-fronted/src/components/chart/chart/chartTreemapD3.vue
@@ -13,6 +13,7 @@
       :legends="legends"
       :series="series"
       :is-fullscreen="isFullscreen"
+      class="legends-flex"
     ></chart-legend>
     </div>
     <div :class="`chart-canvas-tooltip-${chartId}`" :id="`chart-canvas-tooltip-${chartId}`" class="chart-canvas-tooltip" :style="{left:tooltip.x+'px',top:tooltip.y+'px'}" v-if="tooltip.show">
@@ -209,7 +210,6 @@ export default {
     },
     // 处理label
     treemapFormatterLabel (node) {
-      console.log(1100)
       let str = ''
       let valueStr = ''
       if (this.chartInfo.param.text === 'all') {
@@ -226,7 +226,6 @@ export default {
         str += ''
       }
       if (str && valueStr) {
-        console.log(1)
         return `
               <div style="width:100%;height: 100%;display: flex;align-items: center;justify-content: center;flex-direction: column;cursor: pointer;">
                 <p style="width: 80%;text-overflow: ellipsis;white-space: nowrap;overflow:hidden;text-align:center">
@@ -239,7 +238,6 @@ export default {
               </div>
             `
       } else if (str) {
-        console.log(2)
         return `
               <div style="width:100%;height: 100%;display: flex;align-items: center;justify-content: center;flex-direction: column;cursor: pointer;">
                 <p style="width: 80%;text-overflow: ellipsis;white-space: nowrap;overflow:hidden;text-align:center">
@@ -249,7 +247,6 @@ export default {
               </div>
             `
       } else if (valueStr) {
-        console.log(3)
         return `
               <div style="width:100%;height: 100%;display: flex;align-items: center;justify-content: center;flex-direction: column;cursor: pointer;">
                 <p style="width: 80%;text-overflow: ellipsis;white-space: nowrap;overflow:hidden;text-align:center">
@@ -373,4 +370,20 @@ export default {
 </script>
 
 <style scoped>
+.theme-light .legend-container .legend-item {
+    white-space: nowrap;
+    margin-right: 10px;
+    cursor: pointer;
+    display: inline-block;
+    flex-wrap: wrap;
+    flex-direction: column;
+}
+.theme-light .legend-container{
+  height:30px !important;
+    -ms-overflow-style: none;  /* Internet Explorer 10+ */
+    scrollbar-width: none;     /* Firefox */
+}
+.container::-webkit-scrollbar {
+    display: none;            /* Safari and Chrome */
+}
 </style>