echarts学习笔记

折线图基本配置

        var option = {
            title: {
                text: '示例'//标题
            },
            tooltip: {
                trigger: 'axis'//触发类型，默认（'item'）数据触发，可选为：'item' | 'axis'
            },
            legend: {//图例，每个图表最多仅有一个图例  
                data: ['销量', '销量2'],
                show: true //显示策略，可选为：true（显示） | false（隐藏），默认值为true
            },
            xAxis: {
                type: 'category',
                data: ["1月", "2月", "3月", "4月", "5月", "6月"],
                name: "月份",
                boundaryGap: true,
                axisLabel: {
                    interval: 0, //横轴信息全部显示  
                    rotate: -30, //-30度角倾斜显示  
                }
            },
            yAxis: {
                type: "value",
                name: "总量"
            },
            series: [{//直角坐标系中横轴数组，数组中每一项代表一条横轴坐标轴，仅有一条时可省略数值  
            //横轴通常为类目型，但条形图时则横轴为数值型，散点图时则横纵均为数值型
                name: '销量',
                type: 'line',//折线类型
                symbol: 'star', //拐点样式
                symbolSize: 8, //拐点大小
                data: [5, 20, 36, 10, 10, 20],
                itemStyle: {
                    normal: {
                        color: 'blue',//拐点颜色
                        lineStyle: {//折线样式
                            color: 'red',//折线颜色
                            width: 10官网链接
                        }
                    }
                }
            }, {
                name: '销量2',
                type: 'line',
                symbol: 'star', //拐点样式
                symbolSize: 8, //拐点大小
                data: [20, 36, 10, 10, 20, 5],
                itemStyle: {
                    normal: {
                        color: 'blue',
                        lineStyle: {
                            color: '#00FF00',
                            width: 10
                        }
                    }
                }
            }]
        }