echaers map整理

来源:互联网 发布:com的域名需要备案吗 编辑:程序博客网 时间:2024/04/25 17:16

最近在学习echarts,感觉官网好多属性不好理解,根据官网的例子,写了一下注释,以备用。


<!DOCTYPE html><html><head><title>Map2.html</title><meta charset="UTF-8"></head><body><div id="main" style="width: 1200px;height:800px"></div><script src="js/echarts.js"></script><script src="js/china.js"></script><script type="text/javascript">var myChart = echarts.init(document.getElementById("main"));/* myChart.showLoading({    text: '正在努力的读取数据中...',    //loading话术}); */function randomData() {//生成下面使用的随机数    return Math.round(Math.random()*1000);}option = {title: {//标题text : '销量分布',//主标题subtext : '模拟',//副标题left : 'center'//居中对齐},tooltip: {//气泡提示配置trigger : 'item'//tooltip触发方式:axis以X轴线触发,item以每一个数据项触发 },legend: {//图例菜单,可以点击隐藏或者显示series对应name的数据orient : 'vertical',//垂直方向对齐left : 'left',//左对齐data : ['a','b','c']//图例说明文字,需要与series中的name相同},visualMap:{//视觉映射min : 0,//最大最小值max : 2500,left: 'left',//左对齐top: 'bottom',//映射条在页面底部text: ['高','低'],// 文本,默认为数值文本calculable: true//可拖动的计算条,可以调节最大最小范围},toolbox: {//工具栏show: true,//是否显示,默认是trueorient: 'vertical',//垂直方向对齐left: 'right',top: 'center',feature: {dataView : {readOnly:false},//数据视图restore :  {},//还原saveAsImage : {}//保存为图片}},series:[//驱动图表生成的数据内容数组,理论上生成图标的内容数据全部在这里{name : 'a',type : 'map',//图表类型mapType : 'china',//地图类型roam : true,//是否可以拖动,缩放,默认是falselabel : {//标记normal : {show : true},//平时显示格式emphasis : {show : true}//鼠标移入时显示格式},data : [//具体数据{name: '北京',value: randomData() },                {name: '天津',value: randomData() },                {name: '上海',value: randomData() },                {name: '重庆',value: randomData() },                {name: '河北',value: randomData() },                {name: '河南',value: randomData() },                {name: '云南',value: randomData() },                {name: '辽宁',value: randomData() },                {name: '黑龙江',value: randomData() },                {name: '湖南',value: randomData() },                {name: '安徽',value: randomData() },                {name: '山东',value: randomData() },                {name: '新疆',value: randomData() },                {name: '江苏',value: randomData() },                {name: '浙江',value: randomData() },                {name: '江西',value: randomData() },                {name: '湖北',value: randomData() },                {name: '广西',value: randomData() },                {name: '甘肃',value: randomData() },                {name: '山西',value: randomData() },                {name: '内蒙古',value: randomData() },                {name: '陕西',value: randomData() },                {name: '吉林',value: randomData() },                {name: '福建',value: randomData() },                {name: '贵州',value: randomData() },                {name: '广东',value: randomData() },                {name: '青海',value: randomData() },                {name: '西藏',value: randomData() },                {name: '四川',value: randomData() },                {name: '宁夏',value: randomData() },                {name: '海南',value: randomData() },                {name: '台湾',value: randomData() },                {name: '香港',value: randomData() },                {name: '澳门',value: randomData() }]},{name : 'b',type : 'map',//图表类型mapType : 'china',//地图类型roam : true,//是否可以拖动,缩放,默认是falselabel : {//标记normal : {show : true},//平时显示格式emphasis : {show : true}//鼠标移入时显示格式},data : [{name: '北京',value: randomData() },                {name: '天津',value: randomData() },                {name: '上海',value: randomData() },                {name: '重庆',value: randomData() },                {name: '河北',value: randomData() },                {name: '安徽',value: randomData() },                {name: '新疆',value: randomData() },                {name: '浙江',value: randomData() },                {name: '江西',value: randomData() },                {name: '山西',value: randomData() },                {name: '内蒙古',value: randomData() },                {name: '吉林',value: randomData() },                {name: '福建',value: randomData() },                {name: '广东',value: randomData() },                {name: '西藏',value: randomData() },                {name: '四川',value: randomData() },                {name: '宁夏',value: randomData() },                {name: '香港',value: randomData() },                {name: '澳门',value: randomData() }]},{name : 'c',type : 'map',//图表类型mapType : 'china',//地图类型roam : true,//是否可以拖动,缩放,默认是falselabel : {//标记normal : {show : true},//平时显示格式emphasis : {show : true}//鼠标移入时显示格式},data : [{name: '北京',value: randomData() },                {name: '天津',value: randomData() },                {name: '上海',value: randomData() },                {name: '广东',value: randomData() },                {name: '台湾',value: randomData() },                {name: '香港',value: randomData() },                {name: '澳门',value: randomData() }]}]};myChart.setOption(option);</script></body></html>



0 0
原创粉丝点击