updating translation of the y axis labels

src/components/BeeswarmChart.vue

@@ -109,6 +109,8 @@ const bubbleCheckboxEndText = computed(() => t('text.components.chartText.bubble
 const bubbleTooltipText = computed(() => t('text.components.chartText.bubbleText'));
 const bubbleLegendText = computed(() => t('text.components.chartText.bubbleLegend'));
 const bubbleYAxisText = computed(() => t('text.components.chartText.bubbleYaxis'));
+const bubbleYlabelMax = computed(() => t('text.components.chartText.bubbleYlabelMax'));
+const bubbleYlabelMin = computed(() => t('text.components.chartText.bubbleYlabelMin'));
 
 // Labels for each category
 const demographicText = computed(() => t('text.components.chartText.bubbleLabels.Demographiccharacteristics'));
@@ -256,14 +258,14 @@ function createBeeswarmChart() {
     .attr("text-anchor", "left")
     .attr("font-weight", 700)
     .attr("transform", `translate(${margin.left}, ${margin.top / 2})`)
-    .text(t('text.components.chartText.bubbleYlabelMax'));
+    .text(bubbleYlabelMax.value);
 
   svg.append('text')
     .attr("class", "yLabel")
     .attr("text-anchor", "left")
     .attr("font-weight", 700)
     .attr("transform", `translate(${margin.left}, ${containerHeight - (margin.bottom / 2) + 10})`)
-    .text(t('text.components.chartText.bubbleYlabelMin'));
+    .text(bubbleYlabelMin.value);
 
   // Set forces
   const forceY = d3.forceY(d => yScale(d.level_agreement)).strength(0.9);