1

我的问题类似于 Highcharts 中的问题：Show special marker on column chart

我有一个柱形图，它是特定时期共同基金回报的直方图。我想用特殊标记突出显示感兴趣的共同基金下跌的位置。

例如，我的 x 轴上有 -50 到 -25、-25 到 0、0 到 10、10 到 20、20 到 30 和 30 到 50，以及相应的 Y 值。我想在“20 到 30”上用标记突出显示感兴趣的共同基金属于该类别。我知道我们可以使用像http://www.highcharts.com/demo/spline-symbols这样的样条图来做到这一点。

有没有办法对柱形图做同样的事情？

4

1 回答 1

2

一般来说，您不能将自定义标记添加到柱形图中，但您可以添加类似的行为。我已经为分散系列创建了带有自定义标记的简单示例，如果您想在图例中添加更多系列，这很有用：http: //jsbin.com/oyudan/37/edit（如果没有，只需设置showInLegend: false）

Highcharts.updateMarketMarkers = function (chart) {
    /* get category width */
    var catWidth = chart.xAxis[0].width / chart.xAxis[0].categories.length;
    /* get padding of each column (two sides) */
    var catPadding = chart.series[0].options.pointPadding * catWidth;
    /* actual value - padding - symbol width/2 */ 
    chart.series[2].markerGroup.translate(chart.series[2].markerGroup.translateX - 2 * catPadding - chart.series[2].data[0].shapeArgs.r / 2);
};
chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        type: 'column',
        showAxes: false,
        events: {
            load: function () {
                Highcharts.updateMarketMarkers(this);
            },
            redraw: function () {
                Highcharts.updateMarketMarkers(this);
            }
        }
    },
    ...

另一种解决方案是使用 Highcharts 渲染器在特定位置绘制自定义形状。在这里您可以找到有关渲染器的更多信息：http: //api.highcharts.com/highcharts#Renderer

于 2013-02-18T12:35:49.250 回答