Question

使用echarts进行数据图形化显示，为什么visualMap没有起作用

Answer 1

<script type="text/javascript">
require.config({
paths:{
echarts:'./js/echarts',
'echarts/chart/bar' : './js/echarts-map',
'echarts/chart/line': './js/echarts-map',
'echarts/chart/map': './js/echarts-map'
}
});
var option = {
title : {
text: '某地区蒸发量和降水量',
subtext: '纯属虚构'
},
tooltip : {
trigger: 'axis'
},
legend: {
data:['蒸发量','降水量']
},
toolbox: {
show : true,
feature : {
mark : {
show : true,
title : {
mark : '辅助线开关',
markUndo : '删除辅助线',
markClear : '清空辅助线'
},
lineStyle : {
width : 2,
color : '#1e90ff',
type : 'dashed'
}
},
dataZoom : {
show : true,
title : {
dataZoom : '区域缩放',
dataZoomReset : '区域缩放后退'
}
},
dataView : { show : true,
title : '数据视图',
readOnly: false,
lang : ['数据视图', '关闭', '刷新']
},
magicType: {
show : true,
title : {
line : '折线图切换',
bar : '柱形图切换',
stack : '堆积',
tiled : '平铺'
},
type : ['line', 'bar', 'stack', 'tiled']
},
restore : {show: true,
title:'还原',
color:'black'
},
saveAsImage : {show: true,
title:'保存为图片',
type:'jpeq',
lang:['点击本地保存']
}
}
},
calculable : true,
dataZoom : {
show : true,
realtime : true,
start : 20,
end : 80
},
xAxis : [
{
type : 'category',
data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月']
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
name:'蒸发量',
type:'bar',
data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3],
markPoint : {
data : [
{type : 'max', name: '最大值'},
{type : 'min', name: '最小值'}
]
},
markLine : {
data : [
{type : 'average', name: '平均值'}
]
}
},
{
name:'降水量',
type:'bar',
data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
markPoint : {
data : [
{name : '年最高', value : 182.2, xAxis: 7, yAxis: 183, symbolSize:18},
{name : '年最低', value : 2.3, xAxis: 11, yAxis: 3}
]
},
markLine : {
data : [
{type : 'average', name : '平均值'}
]
}
}
]
};

require(
[
'echarts',
'echarts/chart/bar',
'echarts/chart/line',
'echarts/chart/map'
],
function(ec) {
var myChart = ec.init(document.getElementById('demo1'));
myChart.setOption(option);

}
);

Answer 2

visualMap是3.x版本中2.x中dataRange的新名字 你要是引用的2.x的echarts.js 就没有visualMap组件 你需要引用3.x的js文件