2

我有一个 gRaphael 折线图,我使用下面的函数在点击时更新,我遇到的问题是当我尝试设置列值时,它没有生效。像这样...

         var iniGraph   = Raphael("graph"),
        chart = iniGraph.linechart(
                0,5,
                $('#graph').width(),$('#graph').height(),
                xVals,yVals,
                { nostroke: false, symbol: ["circle",""], width: 1.5, smooth: true, shade: true, colors: ['#008cc2', '#7500c6'] }
         ).hoverColumn(function(){
                // AFTER UPDATE THESE VALUES STILL REMAIN UNCHANGED
                console.log(this.values[0]+" | "+this.values[1]);
         },function(){
                // do nothing
         });


    function animateChart(graph,curChart,newX,newY)
    {
        // generate the new chart
        var newChart = graph.linechart(
                0,5,
                $('#graph').width(),$('#graph').height(),
                newX,
                newY,
                { nostroke: false, symbol: ["circle",""], width: 1.5, smooth: true, shade: true, colors: ['#008cc2', '#7500c6'] }
         );

        // THIS DOES NOT WORK, THE ORIGINAL VALUES REMAIN AFTER UPDATE 
        curChart.eachColumn(function(){
            this.values[0] = 12341234;
            this.values[1] = 12341234;
        });

        // animate the symbols
        $.each(curChart.symbols[0],function(i,symbol){
            symbol.animate({ cx: newChart.symbols[0][i].attr("cx"),cy: newChart.symbols[0][i].attr("cy") }, 200);
        });

        // animate the lines
        $.each(curChart.lines,function(i,line){
            line.animate({ path: newChart.lines[i].attr("path") }, 200);
        });

        // remove the new chart
        newChart.remove();
    }

我创建了一个初始图形并创建了折线图,然后我使用该animateChart函数将折线图设置为动画/更新为它的新值,我遇到的问题是在悬停时,animateChart函数运行后值保持不变,所以我坚持使用图表的初始值,这并不理想,因为我必须让列值更新为我指定的新值。

所以基本上,当我动画/更新折线图时如何更新列值?

我有点走投无路了……谢谢。

4

0 回答 0