Echarts 快速入门 上（笔记）

简介（注水）
摘抄经典励志书籍《人性的弱点》里的一段话：
我们忘事的速度真惊人
所以，你要从本书得到一种真实的·持久的益处，不要认为粗略浏览一遍即可。在详细读过以后，你每月应该花费数小时的时间复习它；每天放在你面前的桌上不时翻阅，常常使你自己注意你还有很多可以改进的地方。

正文开始：

一、安装

经典两种安装方式
1.cdn
2.本地安装

import * as echarts from 'echarts'
//创建dom节点
const element = document.createElelment('div')
element.id = "main"
elment.style.width="100%"
element.style.height="400px"

document.body.appendChild(element)

//初始化 echarts 实例
const myEcharts = echarts.init(document.geElementById('main')) //可以传入多个参数
window.onresize = function(){ //自适应
		myEcharts.resize()
}
const option = {
		title: {
          text: 'ECharts 入门示例'
        },
        //提示
        tooltip: {},
        //图例 即右上角小图例
        legend: {
          data: ['销量']
        },
        //x轴
        xAxis: {
          data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子']
        },
        //y 轴
        yAxis: {},
        //设置数据
        series: [
          {
            name: '销量',
            type: 'bar',
            data: [5, 20, 36, 10, 10, 20]
          }
        ]

}
myEcharts.setOption(option)

二、图表容器及大小

1.初始化

推荐在HTML中定义有宽度和高度的父容器

<div id="main" style="width: 600px;height:400px;"></div>
<script type="text/javascript">
  var myChart = echarts.init(document.getElementById('main'));
</script>