Question

我想在最后一点画一个标记。数据源是动态的。看看下面的代码

$(function() {

    $("#btn").click(function() {
        var l = chart.series[0].points.length;
        var p = chart.series[0].points[l - 1];
        p.marker = {
            symbol: 'square',
            fillColor: "#A0F",
            lineColor: "A0F0",
            radius: 5
        };
        a = 1;
        chart.series[0].points[l - 1] = p;
        chart.redraw(false);

    });



    var ix = 13;
    var a = 0;

    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            events: {
                load: function() {
                    var series = this.series[0];
                    setInterval(function() {
                        ix++;
                        var vv = 500 + Math.round(Math.random() * 40);
                        chart.series[0].data[0].remove();
                        var v;
                        if (a == 1) v = {
                            y: vv,
                            x: ix,
                            marker: {
                                symbol: 'square',
                                fillColor: "#A0F",
                                lineColor: "A0F0",
                                radius: 5
                            }
                        }
                        else v = {
                            y: vv,
                            x: ix
                        }

                        a = 0;

                        series.addPoint(v);
                    }, 1500);
                }
            }
        },
        plotOptions: {
            series: {}
        },

        series: [{
            data: [500, 510, 540, 537, 510, 540, 537, 500, 510, 540, 537, 510, 540, 537]}]
    });
});

http://jsfiddle.net/9zNUP/

按钮点击事件我试图在已经添加到图表的最后一个点上绘制标记。

有办法吗？

Answer 1

 $("#btn").click(function() {
    var l = chart.series[0].points.length;
    var p = chart.series[0].points[l - 1];
    p.update({
        marker: {
            symbol: 'square',
            fillColor: "#A0F",
            lineColor: "A0F0",
            radius: 5
        }
    });
    a = 1;

});

解决方案@ http://jsfiddle.net/jugal/zJZSx/

稍微整理你的代码，在最后添加一个之前删除了点的删除，highcharts支持它与第三个param一起构建addPoint为true，表示shift系列，删除第一个点然后添加给定点。

我真的不明白vv等是什么，但我也没有太多麻烦。我认为这足以满足你的要求。

在highcharts中的最后一个点上动态绘制标记

1 个答案: