zoukankan      html  css  js  c++  java
  • echarts画图需要每隔5秒定时刷新,怎样消除之前画的图?

    html:
    <div class="chartContent">
    
    <div id="multiple"></div>
    </div>
    
    JS:
    var echart={
    
    arrPrice:[],
    arrRate:[],
    time:[]
    };
    //***我用了一个getData()来通过ajax实现获取实时数据;***
    function getData(){
        $.ajax({
            url:'mod.json',
            type:'post',
            async:true,
            data:'',
            dataType:'json',
            success:function(data){
                for(i in data.result){
                    echart.arrPrice.push(data.result[i].price);
                    echart.arrRate.push(data.result[i].rise);
                    echart.time.push(data.result[i].time);
                }
                drawChart();
            },
            error:function(){
                console.log('error')
            }
        });
    }
    **//drawChart()y用来实现echarts画图;**
        function drawChart(){
        var dom = document.getElementById("multiple");
        var myChart = echarts.init(dom);
        option = {
                 xxx
                }
            ]
        };
        if (option && typeof option === "object") {
            myChart.setOption(option, true);
        }
    }

    然后

    window.setInterval(function(){
    
        //getData()
    },3000);
    来实现5秒定时刷新

    存在一个问题,这个方法是追加数据的,没有实现定时情况再更新------------------

    参考资料:https://segmentfault.com/q/1010000019459140/

  • 相关阅读:
    git
    Django RestFramework
    vuex以及axios
    npm 、webpack 、 vue-cli
    vue的生命周期
    vue-router
    vue框架 (小清单)
    nodejs review-01
    npm-bluebird使用
    js整理4
  • 原文地址:https://www.cnblogs.com/mahmud/p/11899499.html
Copyright © 2011-2022 走看看