fix #4422; prevent duplicate labels in y-axis

apexcharts · Jul 11, 2024 · 1af289f · 1af289f
1 parent 67f48e5
commit 1af289f
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 17 deletions.
diff --git a/samples/react/mixed/duplicate-labels.html b/samples/react/mixed/duplicate-labels.html
@@ -167,17 +167,19 @@
  tooltip: {
  shared: false,
  intersect: true,
+ y: {
+ formatter: function(val) {
+ return val.toFixed(1)
+ }
+ }
  },
  legend: {
  show: false
  },
  yaxis: {
  labels: {
  formatter: function(val) {
- <!--Removal of duplicate labels can only be done within the formatter itself-->
- let ref = val;
- val = ref.toFixed(0);
- return val == ref ? val : ''; <!--Don't use '===' here-->
+ return val.toFixed(0)
  }
  }
  },

diff --git a/samples/source/mixed/duplicate-labels.xml b/samples/source/mixed/duplicate-labels.xml
@@ -15,17 +15,19 @@ markers: {
 tooltip: {
  shared: false,
  intersect: true,
+ y: {
+ formatter: function(val) {
+ return val.toFixed(1)
+ }
+ }
 },
 legend: {
  show: false
 },
 yaxis: {
  labels: {
  formatter: function(val) {
- <!--Removal of duplicate labels can only be done within the formatter itself-->
- let ref = val;
- val = ref.toFixed(0);
- return val == ref ? val : ''; <!--Don't use '===' here-->
+ return val.toFixed(0)
  }
  }
 },

diff --git a/samples/vanilla-js/mixed/duplicate-labels.html b/samples/vanilla-js/mixed/duplicate-labels.html
@@ -150,17 +150,19 @@
  tooltip: {
  shared: false,
  intersect: true,
+ y: {
+ formatter: function(val) {
+ return val.toFixed(1)
+ }
+ }
  },
  legend: {
  show: false
  },
  yaxis: {
  labels: {
  formatter: function(val) {
- <!--Removal of duplicate labels can only be done within the formatter itself-->
- let ref = val;
- val = ref.toFixed(0);
- return val == ref ? val : ''; <!--Don't use '===' here-->
+ return val.toFixed(0)
  }
  }
  },

diff --git a/samples/vue/mixed/duplicate-labels.html b/samples/vue/mixed/duplicate-labels.html
@@ -170,17 +170,19 @@
  tooltip: {
  shared: false,
  intersect: true,
+ y: {
+ formatter: function(val) {
+ return val.toFixed(1)
+ }
+ }
  },
  legend: {
  show: false
  },
  yaxis: {
  labels: {
  formatter: function(val) {
- <!--Removal of duplicate labels can only be done within the formatter itself-->
- let ref = val;
- val = ref.toFixed(0);
- return val == ref ? val : ''; <!--Don't use '===' here-->
+ return val.toFixed(0)
  }
  }
  },

diff --git a/src/modules/axes/YAxis.js b/src/modules/axes/YAxis.js
@@ -105,10 +105,17 @@ export default class YAxis {
  const getForeColor = () => {
  return Array.isArray(yColors) ? yColors[i] : yColors
  }
+
+ let existingYLabels = Utils.listToArray(
+ w.globals.dom.baseEl.querySelectorAll(
+ `.apexcharts-yaxis[rel='${realIndex}'] .apexcharts-yaxis-label tspan`
+ )
+ ).map((_) => _.textContent)
+
  let label = graphics.drawText({
  x: xPad,
  y: lY,
- text: val,
+ text: existingYLabels.indexOf(val) >= 0 ? '' : val,
  textAnchor,
  fontSize: yaxisFontSize,
  fontFamily: yaxisFontFamily,