highcharts Highchart -箭头形式的列区域

fxnxkyjh  于 2022-11-10  发布在  Highcharts
关注(0)|答案(1)|浏览(185)

我正在整合栏范围图表,但希望栏显示为箭头。箭头可以向下/向上,视值是增加还是减少而定。
我似乎找不到任何解决办法来实现这一点。
下面是我正在努力实现的参考图片。

第一个

hmae6n7t

hmae6n7t1#

可以使用Highcharts.SVGRenderer渲染三角形。

API参考:https://api.highcharts.com/class-reference/Highcharts.SVGRenderer

但我认为最简单的选择是使用带有三角形标记的散点序列来实现这一点。检查以下配置和演示:

{
  type: 'scatter',
  showInLegend: false,
  enableMouseTracking: false,
  marker: {
    symbol: 'triangle-down',
    fillColor: 'rgb(124, 181, 236)',
    radius: 9
  },
  states: {
    inactive: {
      opacity: 1,
    },
  },
  data: [{
      x: 9,
      y: -1.3
    },
    {
      x: 10,
      y: -8.7
    },
    {
      x: 11,
      y: -9.0
    }
  ]
}

演示:https://jsfiddle.net/BlackLabel/3rokf4aw/

相关问题