Formatting reminder
tooltip: {
trigger: 'item', // single display, multiple tips use axis
//formatter: "{a} <br/> {c} ({d}%)"
formatter: function(params, ticket, callback){
alert("formatter");
//return the formatted information by yourself
}
}
echarts multi-picture example
http://www.oschina.net /question/2430036_2157470
A picture contains two pie pictures
option1 = { title : { text: 'Gender Statistics', subtext: 'Purely fictional', x:'right' }, tooltip : { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" }, legend: { orient: 'vertical', left: 'left', data: ['Bachelor male', 'Undergraduate female', 'Master male', 'Master female'] }, series : [ { name: 'Master', type: 'pie', radius : '55%', center: ['35%', '30%'], data:[ {value:250, name:'Master male'}, {value:150, name:'Master Female'} ], itemStyle: { emphasis: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } }, { name: 'Undergraduate', type: 'pie', radius: '55%', center: ['70%', '70%'], data: [ {value: 500, name: 'Undergraduate male'}, {value: 300, name: 'Undergraduate Female'} ] } ] }; myChart1 = echarts.init(document.getElementById('canvas1'), globalEChartTheme); myChart1.setOption(option1);
A bar chart + a pie chart
option1 = { "title": {"text": "Purchasing Statistics Ranking", "subtext": "Purchasing Statistics Ranking"}, "tooltip": {"trigger": "axis"}, "legend": { "x": "left", "y": "bottom", "data": ["切割机V1", "PVC0.4", "PVC0.9"] }, "toolbox": { "show": true, "orient": "vertical", "x": "right", "y": "center", "feature": { "mark": {"show": true}, "dataView": {"show": true, "readOnly": false}, "magicType": {"show": true, "type": ["line", "bar", "stack", "tiled"]}, "restore": {"show": true}, "saveAsImage": {"show": true} } }, "calculable": true, "xAxis": [{"type": "category", "data": ["Purchase quantity statistics ranking"]}], "yAxis": [{"type": "value"}], "series": [ { "type": "bar", "markPoint": {"data": [{"type": "max", "name": "最大值"}, {"type": "min", "name": "最小值"}]}, "markLine": {"data": [{"type": "average", "name": "平均值"}]}, "name": "Cutter V1", "data": [13] }, { "type": "bar", "markPoint": {"data": [{"type": "max", "name": "最大值"}, {"type": "min", "name": "最小值"}]}, "markLine": {"data": [{"type": "average", "name": "平均值"}]}, "name": "PVC0.4", "data": [1313] }, { "type": "bar", "markPoint": {"data": [{"type": "max", "name": "最大值"}, {"type": "min", "name": "最小值"}]}, "markLine": {"data": [{"type": "average", "name": "平均值"}]}, "name": "PVC0.9", "data": [1125] }, { name: 'Undergraduate', type: 'pie', radius: '10%', center: ['70%', '20%'], data: [ {value: 13, name: 'Cutter V1'}, {value: 1313, name: 'PVC0.4'}, {value: 1125, name: 'PVC0.9'} ] }] }; myChart1 = echarts.init(document.getElementById('canvas1'), globalEChartTheme); myChart1.setOption(option1);
Each period of the histogram corresponds to a separate parallel graph
http://echarts.baidu.com/demo.html#mix-timeline-finance