echarts series里面没有值怎么办?

新手上路,请多包涵

echarts series里面无法获取数据怎么办?后端用的flask传送一个二维元组,四条曲线想分别取每一个小元组的值image.pngx轴用的是实时时间。

<div id="suspension" style="width:300px; height:300px;">
    {% for new_result in result%}
    <script src="js/echarts.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('suspension'));
        var option;
        function randomData() {
        var now = new Date();
        value = value + Math.random() * 21 - 10;
        return {
            value: [
                [now.getHours(), now.getMinutes(), now.getSeconds()].join(':'),
                Math.round(value)
            ]
        }
    }

    var data = [];
    var date = [];
    var value = Math.random() * 1000;
    for (var i = 0; i < 1000; i++) {
        data.push(randomData());
        date.push('')
    }

    option = {
        title: {
                    text: '线位移',
                    textStyle:{
                        fontSize: '20px'
                    }
        },
        tooltip: {
            trigger: 'axis',
            formatter: function (params) {
                params = params[0];
                return params.value[0] + ' / ' + params.value[1];
            },
            axisPointer: {
                animation: false,
                type: 'cross', 
                label: {
                    backgroundColor: ''
                }
            }
        },
        grid: {
                    top:'20%',
                    left: '3%',
                    right: '4%',
                    bottom: '2%',
                    containLabel: true
        },
        legend: { //可以选择显示数据
                    // data:['左前','右前','左后','右后'],
                    data:[
                    {
                        name: '左前',
                    },
                    {
                        name: '右前',
                    },
                    {
                        name: '左后',
                    },
                    {
                        name: '右后',
                    }],
                    top:'7%',
                    textStyle:
                    {
                        fontSize: '15px',
                        color:'black',
                    }
        },
        toolbox: {
                    show: true,
                    feature: {
                        dataView: {readOnly: false},
                        restore: {},
                        saveAsImage: {}
                    }
        },
        dataZoom: {
                    show: false,
                    start: 0,
                    end: 100
        },
        xAxis: {
            type: 'category',
            splitLine: {
                show: false
            },
            interval:10,
            boundaryGap: false,
            scale:true,
            axisLabel:{
                interval:1,
                rotate:45,
            },
            data: date
        },
        yAxis: [{
            type: 'value',
            scale: true,
            name: '',
            axisLabel: { //单位
                formatter: '{value} mm'
            },
            max: 0.5,
            min: -0.5,
            splitLine: {
                show: false
            }
        },
        {
            type: 'value',
            scale: true,
            name: '',
            axisLabel: { //单位
                formatter: '{value} mm'
            },
            max: 0.5,
            min: -0.5,
            splitLine: {
                show: false
            }
        }
        ],
        series: [{
            name: '左前',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data
        },
        {
            name: '右前',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data
        },
        {
            name: '左后',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data
        },
        {
            name: '右后',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data
        }]
    };

    setInterval(function () {
        var _data = randomData();
        data.shift();
        date.shift();
        data.push(_data);
        date.push(_data.value[0])

        myChart.setOption({
            xAxis: {
            data: date  
            },
            series: [{
                data: new_result[0]
            },{
                data: new_result[1]
            },{
                data: new_result[2]
            },{
                data: new_result[3]
            }]
        });
    }, 1000);
    
    myChart.setOption(option);
    </script>
    {% endfor %}
</div>

把循环体放进script标签内,无反应。
把循环体放在外面,会不断创建div模块,series也没有数据。我该怎么样让result的数据显示在series里啊?

阅读 455
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题