Charts 如何使样条曲线图数据点闪烁？

我已经创建了一个样条曲线图。我想让图表上的数据点闪烁？？有人能建议我怎么做吗？ 我使用的是canvasjs的样本图表

我的代码是：

window.onload=函数{ var chart=new CanvasJS.chartcontainer{ 标题：{ 文本：示例 }, animationEnabled：没错， axisY：{ titleFontFamily:arial， 标题字体：12， 包括：错 }, 工具提示：{ 分享：真的 }, 数据：[{ 类型：花键， 名称：test1， showInLegend：是的， 数据点：[{ 标签：abc， y:44 }, { 标签：def， y:37 }, { 标签：ghi， y:34 }, { 标签：jkl， y:36 }, { 标签：mno， y:46 }] }, { 类型：花键， 名称：test2， showInLegend：是的， 数据点：[{ 标签：abc， y:16 }, { 标签：def， y:28 }, { 标签：ghi， y:32 }, { 标签：jkl， y:51 }, { 标签：mno， y:38 }] }, { 类型：花键， 名称：test3， showInLegend：是的， 数据点：[{ 标签：abc， y:1 }, { 标签：def， y:11 }, { 标签：ghi， y:9 }, { 标签：jkl， y:19 }, { 标签：mno， y:29 }] }] }; chart.render； } 兰吉特

您可以使用鼠标事件、markerColor和setInterval来执行此操作，如中所示

var chart = new CanvasJS.Chart("chartContainer", {
    title : {
        text : "sample"
    },
    animationEnabled : true,
    axisY : {
        titleFontFamily : "arial",
        titleFontSize : 12,
        includeZero : false
    },
    toolTip : {
        shared : true
    },
    data : [{
            type : "spline",
            name : "test1",
            mouseover: blink,
            mouseout: stop,
            showInLegend : true,
            dataPoints : [
                {label : "abc",y : 44}, 
                {label : "def",y : 37}, 
                {label : "ghi",y : 34}, 
                {label : "jkl",y : 36}, 
                {label : "mno",y : 46}              
            ]
        }, {
            type : "spline",
            name : "test2",
            mouseover: blink,
            mouseout: stop,
            showInLegend : true,
            dataPoints : [
                {label : "abc",y : 16}, 
                {label : "def",y : 28}, 
                {label : "ghi",y : 32}, 
                {label : "jkl",y : 51}, 
                {label : "mno",y : 38}

            ]
        }, {
            type : "spline",
            name : "test3",
            mouseover: blink,
            mouseout: stop,
            showInLegend : true,
            dataPoints : [
                {label : "abc",y : 1}, 
                {label : "def",y : 11}, 
                {label : "ghi",y : 9}, 
                {label : "jkl",y : 19}, 
                {label : "mno",y : 29}

            ]
        }
    ]
});

var blinkId = null;

function blink(e){
    var dataSeries = e.dataSeries;

    dataSeries.markerColor = "red";
    chart.render();

    blinkId = setInterval(function(){
        if( dataSeries.markerColor === "red"){
            delete dataSeries.markerColor;
        }else
            dataSeries.markerColor = "red";

        chart.render();
    },500);
}

function stop(e){
    clearInterval(blinkId);

    delete e.dataSeries.markerColor;
    chart.render();
}

chart.render();