javascript - 如何在 HighCharts Bell Curve 中渲染特定数据点标记？

Question

Highcharts.chart('container', {
title: {
    text: null
},

legend: {
    enabled: false
},

xAxis: [{
    title: {
        text: null
    },
    visible: false
}, {
    title: {
        text: '5 Meter Sprint'
    },
    opposite: false,
    visible: true
}],

yAxis: [{
    title: {
        text: null
    },
    visible: false
}, {
    title: {
        text: null
    },
    opposite: true,
    visible: false
}],

series: [{
    name: null,
    type: 'bellcurve',
    xAxis: 1,
    yAxis: 1,
    intervals: 4,
    baseSeries: 1,
    enableMouseTracking: false,
}, {
    name: 'Data',
    data: data,
    visible: false,
}]
});

jsfiddle:https://jsfiddle.net/0b24mwfs/40/

所以我一直在尝试使用 HighCharts 制作高度定制的钟形曲线图表，现在我可以禁用除 xAxis 和钟形曲线本身之外的大多数内容，但是如何在曲线上渲染点通过传递一个特定的值？

更新: 好像在highcharts上叫marker，默认情况下它是沿着曲线渲染所有标记，有没有办法让它通过指定值只渲染一个？

Answer 1

您可以在load事件中更新生成的点:https://jsfiddle.net/BlackLabel/g1qhj8bv/1/

chart: {
  events: {
    load: function () {
    this.series[0].points[10].update({
        marker: {
        enabled: true,
        fillColor: 'white',
        radius: 6,
        lineWidth: 2,
        lineColor: 'red'
      }
    });
  }
}

},

唯一的问题是找到您需要的点的索引:points[10]。我认为你可以简单地循环它们，直到找到所需的，然后更新。