echarts

echarts简介
    百度开发团队制作，开源交个apache基金管理
    制作图表的javascript库
    同类型产品hightCharts  D3
echarts步骤
    1. 初始化
        var echart = echarts.init(dom节点,主题)
    2. 定义选项option
        const option = {
 title标题
legend图例
color调试版本
tooltip提示
xAxis 轴线X
yAxis 轴线Y
series 系列数据
}
    3. 更新选项
        echart.setOption(option)
选项option
    标题
title
        text  文本
    图例
legend
        {data:["name1","name2"]}
    提示
tooltip
    x轴线
        {data:["x1","x2",...]}
    y轴线
        {data:["y1","y2",...]}
    系列数据
        bar
柱状图
            {
name:"名称",
type:"bar",
data:[10,{value:10}],
itemStyle:{color:xxx}
}
        line
            {
   name:“名称”，
   type:"line",
   smooth:true, //平滑
   areaStyle:面的样式,
   lineStyle：线的样式
}
        pie
            {
name:"名称",
type:"pie",
radius:["10%","50%"],
data:[{name:"n1",value:40},{name:"n2",value:60}],
left
top
}
图表的类型
type
    柱状图
    线
    平滑线
    面
    饼形图
颜色样式控制
    主题
        默认
dark 深色
light 亮色
    自定义主题
        https://echarts.apache.org/zh/theme-builder.html
        下载并引用
init(dom,“主题名称”)
    调色板
        color:[颜色数组]
    itemStyle
        具体数据
            data:[{value:50,itemStyle:样式}]
        系列数据
            {name:"分析表",data:[],itemStyle:{}}
        normal:{正常样式}
emphasis:{强调样式}
特殊样式
    线
        lineStyle:{width:"10px",cap:"round"}
10像素，端点 平滑
    柱状图
        itemStyle:{borderRadius:[100,100,100,100],}
//圆角，左上，右上 ，右下，左下
    渐变颜色
        var mycolor1 =  {
    type: 'linear',
    x: 0,
    y: 0,
     x2: 0,
    y2: 1,
    colorStops: [{
         offset: 0, color: 'rgba(23, 135, 255, 1)' // 0% 处的颜色
    }, {
         offset: .7, color: 'rgba(27, 201, 249,1)' // 100% 处的颜色
     }],
     global: false // 缺省为 false
        }
堆叠图
    {name:"ui",data:[],stack:true},
{name:"web",data:[],stack:true}
富文本
label
    rich
        rich:{big:{fontSize:"24px"}}
formatter:"{big|中国}"
把“中国”二字给big样式
    formatter
        {a}  系列名称
{b} 名称
{c}  值
{d} 百分百
    position
        "center","insideRight"
中间 内部右侧
    show:false
地图
    {name:"china",type:"map",mapType:"china",data:[{name:"",value:100}]}
    getMap
        fetch(url)
.then(res=>res.json())
.then(res=>{
 echarts.registerMap("china",res);
option.series[0].mapType("china");
echart.setOption(option)
})
    echarts.registerMap(name,res)