fix legend multi chart

richardjozsa · Jul 11, 2021 · 28c6a86 · 28c6a86
1 parent 4a65877
commit 28c6a86
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 10 deletions.
diff --git a/src/components/SearchDialog.vue b/src/components/SearchDialog.vue
@@ -40,7 +40,7 @@
           >
             <template v-slot:selection> panes <i class="icon-pile ml4"></i></template>
             <template v-slot:option="{ value }">
-              {{ value.name }}
+              {{ value.name || value.id }}
             </template>
           </dropdown>
         </div>
@@ -175,7 +175,7 @@ export default {
     },
     paneName() {
       if (this.paneId) {
-        return this.$store.state.panes.panes[this.paneId].name
+        return this.$store.state.panes.panes[this.paneId].name || this.paneId
       } else {
         return null
       }
@@ -534,7 +534,7 @@ export default {
   }
 
   tr.active {
-    background-color: rgba(white, 0.2) !important;
+    background-color: rgba(black, 0.2) !important;
   }
 
   td:first-child,

diff --git a/src/components/chart/Chart.vue b/src/components/chart/Chart.vue
@@ -420,7 +420,7 @@ export default class extends Mixins(PaneMixin) {
 
       for (let j = 0; j < this._chartController.loadedIndicators[i].apis.length; j++) {
         const api = this._chartController.loadedIndicators[i].apis[j]
-        const id = indicator.id + api.id
+        const id = this.paneId + indicator.id + api.id
 
         if (!this._legendElements[id]) {
           continue
@@ -598,7 +598,7 @@ export default class extends Mixins(PaneMixin) {
     await this.$nextTick()
 
     for (let i = 0; i < series.length; i++) {
-      const id = indicatorId + series[i]
+      const id = this.paneId + indicatorId + series[i]
 
       if (this._legendElements[id]) {
         continue
@@ -620,8 +620,10 @@ export default class extends Mixins(PaneMixin) {
       return
     }
 
+    const prefix = this.paneId + indicatorId
+
     for (const legendId in this._legendElements) {
-      if (legendId.indexOf(indicatorId) === 0) {
+      if (legendId.indexOf(prefix) === 0) {
         delete this._legendElements[legendId]
       }
     }

diff --git a/src/components/chart/IndicatorControl.vue b/src/components/chart/IndicatorControl.vue
@@ -13,7 +13,7 @@
       <button class="btn -small" @click="remove" v-tippy title="Disable"><i class="icon-cross"></i></button>
     </div>
     <div v-if="showLegend" class="indicator__legend">
-      <div v-for="serie of series" :key="serie" :id="indicator.id + serie"></div>
+      <div v-for="serie of series" :key="serie" :id="paneId + indicator.id + serie"></div>
     </div>
     <div v-if="error">
       <i class="icon-warning ml4 mr8"></i>

diff --git a/src/components/panes/PaneHeader.vue b/src/components/panes/PaneHeader.vue
@@ -137,7 +137,7 @@ export default class extends Vue {
 
     if (!name) {
       const [, pair] = parseMarket(this.$store.state.panes.panes[this.paneId].markets[0])
-      return pair + ' - ' + this.$store.state.panes.panes[this.paneId].type
+      return pair
     }
 
     return name

diff --git a/src/store/defaultPanes.json b/src/store/defaultPanes.json
@@ -10,7 +10,7 @@
   "panes": {
     "chart": {
       "id": "chart",
-      "name": "Chart",
+      "name": "",
       "type": "chart",
       "markets": [
         "BITFINEX:BTCUSD",
@@ -35,7 +35,7 @@
     },
     "trades": {
       "id": "trades",
-      "name": "TRADES",
+      "name": "",
       "type": "trades",
       "markets": [
         "BITFINEX:BTCUSD",