// 路径配置
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:'/haikou/'},{name: '临高县',value: 11778,url:'/lingao/'},{name: '澄迈县',value: 13680,url:'/chengmai/'},{name: '三亚市',value: 29299,url:'/sanya/'},{name: '琼海市',value: 13550,url:'/qionghai/'},{name: '文昌市',value: 13324,url:'/wenchang/'},{name: '儋州市',value: 11328,url:'/danchou/'},{name: '万宁市',value: 24056,url:'/wanning/'},{name: '陵水县',value: 41064,url:'/lingshui/'},{name: '定安县',value: 10878,url:'/dingan/'},{name: '东方市',value: 13756,url:'/dongfang/'},{name: '屯昌县',value: 9765,url:'/tunchang/'},{name: '昌江县',value: 14505,url:'/changjiang/'},{name: '保亭县',value: 22056,url:'/baoting/'},{name: '乐东县',value: 16856,url:'/ledong/'},{name: '五指山市',value: 13208,url:'/wzs/'},{name: '海南省',value: 15345,url:'/hainan/'},{name: '秀英区',value: 18393,url:'/xiuying/'},{name: '龙华区',value: 15064,url:'/longhua/'},{name: '美兰区',value: 15456,url:'/meilan/'},{name: '琼山区',value: 14402,url:'/qiongshan/'},{name: '西海岸',value: 21325,url:'/xihaian/'},{name: '东海岸',value: 19008,url:'/donghaian/'},{name: '观澜湖',value: 20913,url:'/guanlanhu/'},{name: '白沙县',value: 11265,url:'/baisha/'},{name: '琼中县',value: 9215,url:'/qiongzhong/'},{name: '海南三亚湾',value: 28365,url:'/sanyawan/'},{name: '海南亚龙湾',value: 29315,url:'/yalongwan/'},{name: '海南海棠湾',value: 41035,url:'/haitangwan/'},{name: '陵水土福湾',value: 38736,url:'/tufuwan/'},{name: '陵水香水湾',value: 52345,url:'/xiangshuiwan/'},{name: '陵水清水湾',value: 42898,url:'/qingshuiwan/'},{name: '海南石梅湾',value: 29387,url:'/shimeiwan/'},{name: '海南神州半岛',value: 26980,url:'/shenzhoubandao/'},{name: '海南兴隆镇',value: 22365,url:'/xinglong/'},{name: '海南博鳌镇',value: 18390,url:'/boao/'},{name: '海南月亮湾',value: 15689,url:'/yueliangwan/'},{name: '海南高隆湾',value: 14935,url:'/gaolongwan/'},{name: '恒大棋子湾',value: 15898,url:'/qiziwan/'},{name: '临高马袅湾',value: 13808,url:'/maniaowan/'},{name: '海南龙栖湾',value: 18635,url:'/longxiwan/'},{name: '海南龙沐湾',value: 18165,url:'/longmuwan/'},{name: '白马井镇',value: 14282,url:'/baimajing/'},{name: '江东新区',value: 20813,url:'/jiangdong/'},{name: '三亚吉阳区',value: 27985,url:'/jiyang/'},{name: '三亚天涯区',value: 29315,url:'/tianyaqu/'},{name: '三亚崖州区',value: 19868,url:'/yazhouqu/'},{name: '嘉积镇',value: 14835,url:'/jiaji/'},{name: '官塘温泉度假区',value: 14835,url:'/guantang/'},{name: '文昌清澜',value: 13895,url:'/qinglan/'},{name: '海南洋浦',value: 14365,url:'/yangpu/'},{name: '福山镇',value: 11035,url:'/fushan/'},{name: '金江镇',value: 12680,url:'/jinjiang/'},{name: '老城镇',value: 12689,url:'/laocheng/'},{name: '海南盈滨半岛',value: 15360,url:'/ybbd/'},{name: '海南日月湾',value: 26860,url:'/riyuewan/'},{name: '海南九所镇',value: 12890,url:'/jiusuo/'},{name: '海南八所镇',value: 12756,url:'/basuo/'}, ]
}]
};
// 为echarts对象加载数据
myChart.setOption(option);
});
document.getElementById('tj').innerHTML = '海南省新房均价:{$caty}元/㎡环比上月:-0.69%↓,同比:-0.69%↓';