Javascript flotr2-单击更改点颜色

Javascript flotr2-单击更改点颜色,javascript,flotr2,Javascript,Flotr2,是否可以更改Flotr2中点(线性图形)的填充颜色 我的代码: <script> /* globals*/ var lineColor = '#717171'; var baseLineColor = '#a3d06e'; var titleText = []; /* [title1, title2,...] */ var xticks = []; /* [ [0.9, ""], [1, "strValue1"], ..., [n, strV

是否可以更改Flotr2中点(线性图形)的填充颜色

我的代码:

<script>
    /* globals*/
    var lineColor = '#717171';
    var baseLineColor = '#a3d06e';
    var titleText = []; /* [title1, title2,...] */
    var xticks = [];  /* [ [0.9, ""], [1, "strValue1"], ..., [n, strValueN], [n+0.1, ""] ] */

    var title = document.getElementById('title');
    var data = [ /* the chart data */
        [1, 2],
        [2, 3],
        [3, 3],
        [4, 4],
        [5, 5],
        [6, 5],
        [7, 5],
        [8, 2],
        [9, 3],
        [10, 3],
        [11, 4],
        [12, 5],
        [13, 5],
        [14, 5],
        [15, 5],
        [16, 2],
        [17, 3],
        [18, 3],
        [19, 4],
        [20, 5],
        [21, 5],
        [22, 5],
        [23, 2],
        [24, 3],
        [25, 3],
        [26, 4],
        [27, 5],
        [28, 5],
        [29, 5],
        [30, 5],
    ];

    var container = document.getElementById('chart');


    /*Test - remove for real data*/
    for(var i=1; i<31; i++){
        xticks.push([i, ("label " + i)]);
        titleText[i] = "Title " + i;
    }

    /* chart options */
    var personal = { data : data, /* @data@ */
        lines : { show : true, fill : false, color: lineColor, lineWidth: 4},
        points : { show : true, color: lineColor, radius: 20, fillColor:'#ff0000'}
    };

    var baseline = { data: [[-50,3],[50,3]],
        mouse: {track: false},
        lines : { show : true, fill : false, color: baseLineColor, lineWidth: 4}
    }


    setTimeout(setDimentions, 300);



    function setDimentions(){
        var w = window.innerWidth * 0.8;
        var h = window.innerWidth * 0.45;
        container.style.width = w + "px";
        container.style.height = h + "px";

        drawChart();
    }

    function drawChart(){
        var f = Flotr.draw(container, [baseline, personal],
                {
                    resolution: 2, HtmlText: true,
                    xaxis : { ticks: xticks /* @xticks@ */, tickDecimals: true, min:0.8, max: (data.length+0.2)/*@xmax@*/ },
                    yaxis : { ticks: [1,2,3,4,5], tickDecimals: true, min:0.9, max: 5.1 },
                    mouse : { track : true, sensibility: 10, trackFormatter: showTitle}
                });
    }

    function showTitle(point){
        title.innerHTML = titleText[parseInt(point.x)];
    }

/*全球的*/
变量lineColor='#717171';
var baseLineColor='#a3d06e';
变量titleText=[];/*[标题1,标题2,…]*/
变量xticks=[];/*[[0.9,”],[1,标准值1],…,[n,标准值],[n+0.1,”]*/
var title=document.getElementById('title');
var data=[/*图表数据*/
[1, 2],
[2, 3],
[3, 3],
[4, 4],
[5, 5],
[6, 5],
[7, 5],
[8, 2],
[9, 3],
[10, 3],
[11, 4],
[12, 5],
[13, 5],
[14, 5],
[15, 5],
[16, 2],
[17, 3],
[18, 3],
[19, 4],
[20, 5],
[21, 5],
[22, 5],
[23, 2],
[24, 3],
[25, 3],
[26, 4],
[27, 5],
[28, 5],
[29, 5],
[30, 5],
];
var container=document.getElementById('chart');
/*测试-删除真实数据*/

对于(var i=1;i而言,使用以下选项就足够了:

  mouse : {
    track : true,
    relative : true,
    lineColor : '#FF00FF',
    fillColor : '#0000FF'
  },
我在这里放了一个演示:

以及当点可见时。如何更改悬停时的颜色?