Highchart: флаги выходят из графика на экстремальных сетах - PullRequest
Новая
       20

Highchart: флаги выходят из графика на экстремальных сетах

0 голосов
/ 29 июня 2018

Поскольку highchart предоставляет отличные возможности построения диаграмм, мы включили библиотеку Highchart в наше веб-приложение.

В соответствии с требованием мы должны отображать флаги в определенных точках данных. Поэтому я использую серию flags для достижения того же, что указано ниже: 

   series: [{
      name: 'USD to EUR',
      data: [{
          y: 1,
          x: Date.UTC(2017, 5, 12)
        },
        {
          y: 3,
          x: Date.UTC(2017, 6, 13)
        },
        {
          y: 5,
          x: Date.UTC(2017, 7, 14)
        },
        {
          y: 7,
          x: Date.UTC(2017, 8, 15)
        },
        {
          y: 9,
          x: Date.UTC(2017, 9, 16)
        },
        {
          y: 11,
          x: Date.UTC(2017, 10, 17)
        },
        {
          y: 13,
          x: Date.UTC(2017, 11, 18)
        },
        {
          y: 15,
          x: Date.UTC(2017, 12, 19)
        },
        {
          y: 17,
          x: Date.UTC(2018, 1, 20)
        },
        {
          y: 19,
          x: Date.UTC(2018, 2, 21)
        }
      ],
      id: 'dataseries'

      // the event marker flags
    }, {
      type: 'flags',
      y: -5,
      data: [{
          x: Date.UTC(2017, 5, 12),
          title: ' '
        },
        {
          x: Date.UTC(2017, 6, 13),
          title: ' '
        },
        {
          x: Date.UTC(2017, 7, 14),
          title: ' '
        },
        {
          x: Date.UTC(2017, 8, 15),
          title: ' '
        },
        {
          x: Date.UTC(2017, 9, 16),
          title: ' '
        },
        {
          x: Date.UTC(2017, 10, 17),
          title: ' '
        },
        {
          x: Date.UTC(2017, 11, 18),
          title: ' '
        },
        {
          x: Date.UTC(2017, 12, 19),
          title: ' '
        },
        {
          x: Date.UTC(2018, 1, 20),
          title: ' '
        },
        {
          x: Date.UTC(2018, 2, 21),
          title: ' '
        }
      ]

Но когда ряды строятся с флагами и когда я устанавливаю крайние значения по оси Y, эти символы выходят за пределы графика, как показано на рисунке ниже:

enter image description here

Есть ли способ обойти эту проблему?

Вот JS Fiddle .

1 Ответ

0 голосов
/ 29 июня 2018

Ошибка в Highcharts github, маркер как ошибка: https://github.com/highcharts/highcharts/issues/8546

Обход: 

chart: {
  events: {
    load: function() {
      this.series[1].markerGroup.clip(this.clipRect); // series[1] -> index of flag series
    }
  }
},

Демо-версия:

https://jsfiddle.net/BlackLabel/md82wpfk/8/

...