Как удалить прокрутку текста по X в Highcharts - PullRequest
0 голосов
/ 08 января 2020

Я хочу добавить что-то вроде позиции, прикрепленной к моему тексту в метках на графике. На первом изображении вы можете видеть, как я хочу разместить текст на моем графике.

Возможно, кто-то знает, как решить мою проблему. Мой код внизу. Спасибо! Я хочу отключить перемещение текста под строкой


    Highcharts.chart(container, {
      chart: {
        scrollablePlotArea: {
          minWidth: window.innerWidth < 767 ? 767 : null,
          scrollPositionX: 0,
          marginTop: 20
        },
        events: {
          render() {
            let chart = this,
              legend = chart.legend,
              firstElem = legend.scrollGroup.element.firstElementChild,
              secondElem = legend.scrollGroup.element.lastElementChild;

            // set legend name positions - they are relative to the path, so value can be fixed
            firstElem.children[1].setAttribute('x', 40);
            firstElem.children[1].setAttribute('y', 10);

            secondElem.children[1].setAttribute('x', 20);
            secondElem.children[1].setAttribute('y', 10);

            // after resize - if bottom text exist - destroy it 
            if (chart.text1) {
              chart.text1.destroy()
            }

            if (chart.text2) {
              chart.text2.destroy();
            }
            // render bottom text
            chart.text1 = chart.renderer.text(minX + " - " + maxX + " грн", legend.group.translateX + chart.plotLeft, legend.group.translateY + 40).add();
            chart.text2 = chart.renderer.text(minXY + " - " + maxXY + " °C", legend.group.translateX(50%) + chart.plotLeft + legend.group.getBBox().width / 2, legend.group.translateY + 40).add();
          }


        },
        spacingBottom: 100
      },
      credits: {
        enabled: false
      },
      subtitle: {
        text: null
      },
      xAxis: [{
        endOnTick: true,
        startOnTick: true,
        gridLineColor: "#EDEDED",
        min: 0,
                overflow: "allow",
        labels: {
                    overflow: "allow",
          format: "{value}",
          style: {
            color: "#8F969A",
            fontSize: 11,
            fontFamily: "Roboto"
          }
        },


    });

1 Ответ

1 голос
/ 09 января 2020

Вы можете легко отключить это перемещение, добавив эти тексты в legend.group , что исправлено.

chart.text1 = chart.renderer.text(minX + " - " + maxX + " грн", 20, 40).add(legend.group);
chart.text2 = chart.renderer.text(minXY + " - " + maxXY + " °C", 200, 40).add(legend.group);

То же, что и выше - они относятся к legend.group, поэтому значение можно зафиксировать

Демо: https://jsfiddle.net/BlackLabel/ywfgLphv/1/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...