Echarts学习记录

一般曲线设置

 

option = {
    xAxis: {
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        type: 'bar',
        
        data: [820, 932, 901, 934, 1290, 1330, {
            value:1320,
            itemStyle:{
                
            },
            emphasis:{
                
            },
            tooltip:{
                
            },
            label:{
                show:true,
                position:'top',
                distance:10,
                rotate:-10,
                offset:[10,-10],
                formatter:[
                     '{a|这段文本采用样式a}',
                     '{b|这段文本采用样式b}这段用默认样式{x|这段用样式x}'
                ].join('\n'),
                rich:{
                     a:{
                        color:'red',
                        lineHeight:10 
                     },
                     b: {
                        backgroundColor: {
                        image: 'xxx/xxx.jpg'},
                        height: 40
                     },
                     x: {
                        fontSize: 18,
                        fontFamily: 'Microsoft YaHei',
                        borderColor: '#449933',
                        borderRadius: 4
                     }
                }
            }
        }],
        label:{
            
        },
        itemStyle:{
            
        },
        lineStyle:{
            
        },
        areaStyle:{
            
        },
        emphasis:{
            
        },
    }]
};

 响应鼠标事件

var option = {
    xAxis: {
        data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
    },
    yAxis: {},
    series: [{
        name: '销量',
        type: 'bar',
        data: [5, 20, 36, 10, 10, 20]
    }]
};
myChart.setOption(option);
myChart.on('click', function (params) {
    window.open('https://www.baidu.com/s?wd=' + encodeURIComponent(params.name));
});