echartsjs快速入门-基本概念

官网https://www.echartsjs.com/zh/index.html

使用步骤：

    <!--1. 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width: 1200px;height:800px; margin: 100px auto;"></div>

    <script type="text/javascript">
        // 2.基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));
        // 3.配置信息
        option = {....};
        // 4.使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    </script>

基本配置:

1.title标题

2.tooltip图表的提示框组件

3.legend图例组件

4.toolbox工具箱组件

5.grid网格配置

6.series系列图表的配置，决定图表的样式

name：存在name 就可以不去写legend图例组件

type

stack:数据 堆叠

data

7.legend图例组件

8.color设置线条的颜色

TIM截图20200522212817.png