[apache/echarts]我的demo出现这个问题

2024-07-04 843 views
6
One-line summary [问题简述]

http://echarts.baidu.com/demo.html#dynamic-data2 在这里运行正常

我的demo出现这个问题

Version & Environment [版本及环境]
  • ECharts version [ECharts 版本]:
  • Browser version [浏览器类型和版本]:chrome
  • OS Version [操作系统类型和版本]:win10
Expected behaviour [期望结果] ECharts option [ECharts配置项]
   option = {
        title: {
            text: '动态数据 + 时间坐标轴'
        },
        tooltip: {
            trigger: 'axis',
            formatter: function (params) {
                params = params[0];
                var date = new Date(params.name);
                return date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear() + ' : ' + params.value[1];
            },
            axisPointer: {
                animation: false
            }
        },
        xAxis: {
            type: 'time',
            splitLine: {
                show: false
            }
        },
        yAxis: {
            type: 'value',
            boundaryGap: [0, '100%'],
            splitLine: {
                show: false
            }
        },
        series: [{
            name: '模拟数据',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data
        }]
    };
Other comments [其他信息]

回答

4

什么问题?

6

Uncaught Error: Component series. not exists. Load it first. @pissang

8

完整的例子发下,你系列没写 type 的时候会报这个错

8
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--<script type="text/javascript" src="/Public/assets/js/jquery.min.js"></script>-->
    <script type="text/javascript" src="/Public/Chef/js/echarts.min.js?dfsf"></script>
</head>
<body>
<div id="action_waste" style="width: 600px;height:400px;"></div>

<script>

    var myChart = echarts.init(document.getElementById('action_waste'));

    function randomData() {
        now = new Date(+now + oneDay);
        value = value + Math.random() * 21 - 10;
        return {
            name: now.toString(),
            value: [
                [now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/'),
                Math.round(value)
            ]
        }
    }

    var data = [];
    var now = +new Date(1997, 9, 3);
    var oneDay = 24 * 3600 * 1000;
    var value = Math.random() * 1000;
    for (var i = 0; i < 1000; i++) {
        data.push(randomData());
    }

    option = {
        title: {
            text: '动态数据 + 时间坐标轴'
        },
        tooltip: {
            trigger: 'axis',
            formatter: function (params) {
                params = params[0];
                var date = new Date(params.name);
                return date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear() + ' : ' + params.value[1];
            },
            axisPointer: {
                animation: false
            }
        },
        xAxis: {
            type: 'time',
            splitLine: {
                show: false
            }
        },
        yAxis: {
            type: 'value',
            boundaryGap: [0, '100%'],
            splitLine: {
                show: false
            }
        },
        series: [{
            name: '模拟数据',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            data: data
        }]
    };
    console.log(option);

    function create() {

        for (var i = 0; i < 5; i++) {
            data.shift();
            var d = randomData();
            console.log(d);
            data.push(d);
        }

        myChart.setOption({
            series: [{
                data: data
            }]
        });
    }
    create();
    false && setInterval(create, 1000);
</script>
</body>
</html>
2

已发示例了,@ @pissang

1

...你写的 option 根本没用到啊,create 应该初始化的被你写成更新数据了,close 了

4

这是官方示例呀

3

官方例子里 option 是一个内置变量,为了开发者方便把一些东西都做好了,比如 init 还有初始化的 setOption,但是你自己用的时候还是得自己做啊

4

好的,先谢谢啦 @pissang