Question

由于highchart提供了图表的强大功能，因此我们将Highchart库纳入了我们的Web应用程序。

根据要求，我们必须在特定数据点上显示标志。因此，我正在使用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轴上设置极限时，该符号将不在图表中，如下图所示：

是否可以解决此问题？

这里是JS Fiddle。

Answer 1

问题在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/

Highchart：标志在设定的极限时脱销图表

1 个答案: