// 路径配置
require.config({
paths: {
echarts: 'http://echarts.baidu.com/build/dist'
}
});
// 使用
require(['echarts', 'echarts/chart/line','echarts/chart/map', ],
function (ec) {
var ecConfig = require('echarts/config');
// 基于准备好的dom,初始化echarts图表
var myChart = ec.init(document.getElementById('main'));
// 给地图添加点击事件
myChart.on(ecConfig.EVENT.CLICK,function(param){
if (param.data.url) {
// 模拟点击新标签打开界面
var a = $("").get(0);
var e = document.createEvent('MouseEvents');
e.initEvent('click', true, true);
a.dispatchEvent(e);
};
});
option = {
title : {
text: '海南房价地图',
subtext: '数据来源:ifang0898',
x:'right'
},
tooltip : {
trigger: 'item'
},
legend: {
orient: 'vertical',
x:'-20',
y:'170',
data:['房价(单位:元/㎡)']
},
dataRange: {
min: 4000,
max: 28000,
splitNumber:8,
y:'190',
color:['#ff6100','#fffadc'],
formatter : '{value} - {value2}'
},
series: [{
nameMap:{'昌江黎族自治县':'昌江县','乐东黎族自治县':'乐东县','陵水黎族自治县':'陵水县','保亭黎族苗族自治县':'保亭县','琼中黎族苗族自治县':'琼中县','白沙黎族自治县':'白沙县'},
name: '房价(单位:元/㎡)',
type: 'map',
mapType: '海南',
roam: false,
itemStyle:{
normal:{label:{show:true},color:'#fff',borderColor:'#ccc'},
emphasis: {
borderWidth:2,
color: '#b4d75f',
label: {
show: true,
textStyle: {
color: '#fff'
}
}
}
},
data: [
{name: '海口市',value: 15895,url:'#'},{name: '临高县',value: 11778,url:'#'},{name: '澄迈县',value: 13680,url:'#'},{name: '三亚市',value: 29299,url:'#'},{name: '琼海市',value: 13550,url:'#'},{name: '文昌市',value: 13324,url:'#'},{name: '儋州市',value: 11328,url:'#'},{name: '万宁市',value: 25680,url:'#'},{name: '陵水县',value: 40368,url:'#'},{name: '定安县',value: 10690,url:'#'},{name: '东方市',value: 13428,url:'#'},{name: '屯昌县',value: 9860,url:'#'},{name: '昌江县',value: 14105,url:'#'},{name: '保亭县',value: 19506,url:'#'},{name: '乐东县',value: 16236,url:'#'},{name: '五指山市',value: 13008,url:'#'},{name: '海南省',value: 14725,url:'#'},{name: '秀英区',value: 17489,url:'#'},{name: '龙华区',value: 14595,url:'#'},{name: '美兰区',value: 15005,url:'#'},{name: '琼山区',value: 13775,url:'#'},{name: '西海岸',value: 20825,url:'#'},{name: '东海岸',value: 18802,url:'#'},{name: '观澜湖',value: 19355,url:'#'},{name: '白沙黎族自治县',value: 12035,url:'#'},{name: '琼中黎族苗族自治县',value: 9036,url:'#'}, ]
}]
};
// 为echarts对象加载数据
myChart.setOption(option);
});
document.getElementById('tj').innerHTML = '海南省新房均价:{$caty}元/㎡环比上月:-0.69%↓,同比:-0.69%↓';