如何在没有Fixed.Duration的情况下更新人力图

时间:2017-07-17 14:40:46

标签: javascript jquery ajax rickshaw

我正在尝试使用人力车创建实时图形,但我没有找到如何在没有固定持续时间的情况下更新图形,如示例(extensions.html)中所示。

我已经知道如何使用JSON文件构建我的图形,但我不知道如何更新数据(仅图表上的数据,我想保持我的滑块原样)而不是刷新整个页。

这是我的代码:

<script>

jQuery.ajax({
  'url': "Mesure.json",
  'success': renderGraph // callback for ajax success
});


// wrap graph creation logic in a function to be used as a callback
function renderGraph(json) {
<!--========================================================================-->
<!--                   COLOR PALETTE FOR DATA IN GRAPHIC                    -->
<!--========================================================================-->


var palette = new Rickshaw.Color.Palette( { scheme: 'spectrum14' } );


<!--========================================================================-->
<!--                     GRAPHIC OF DATA FROM DATABASE                      -->
<!--========================================================================-->

var graph = new Rickshaw.Graph( {
        element: document.getElementById("chart"),
        width: 900,
        height: 500,
        renderer: 'scatterplot',
        stroke: true,
        preserve: true,
        series: [

{
                        color: palette.color(1),
                        data: json[0].data,
                        name: 'Photorésistance 1',
                        opacity: 0.9
                }, {
                        color: palette.color(4),
                        data: json[1].data,
                        name: 'Photorésistance 2',
                        opacity: 0.9
                }, {
                        color: palette.color(8),
                        data: json[2].data,
                        name: 'Photorésistance 3',
                        opacity: 0.9
                }, {
                        color: palette.color(12),
                        data: json[3].data,
                        name: 'Photorésistance 4',
                        opacity: 0.9
                }
        ]
} );

graph.renderer.dotSize=4;
graph.render();

setInterval( function() { graph.update();}, 5000);

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

我必须确切地说我是php,javascript,Jquery,Ajax的初学者,我没有时间在互联网上关注某些课程(这是为了在2周内完成实习)。

0 个答案:

没有答案