// 路径配置
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: 11688,url:'#'},{name: '澄迈县',value: 12680,url:'#'},{name: '三亚市',value: 27665,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: 9015,url:'#'},{name: '海南三亚湾',value: 27669,url:'#'},{name: '海南亚龙湾',value: 28625,url:'#'},{name: '三亚海棠湾',value: 39028,url:'#'},{name: '陵水土福湾',value: 38058,url:'#'},{name: '陵水香水湾',value: 51068,url:'#'},{name: '陵水清水湾',value: 42865,url:'#'},{name: '万宁石梅湾',value: 28665,url:'#'},{name: '万宁神州半岛',value: 26890,url:'#'},{name: '万宁兴隆镇',value: 21565,url:'#'},{name: '文昌月亮湾',value: 15253,url:'#'},{name: '文昌高隆湾',value: 14890,url:'#'},{name: '恒大棋子湾',value: 15685,url:'#'},{name: '临高马袅湾',value: 13506,url:'#'},{name: '乐东龙栖湾',value: 18228,url:'#'},{name: '乐东龙沐湾',value: 17982,url:'#'},{name: '白马井镇',value: 13860,url:'#'}, ]
}]
};
// 为echarts对象加载数据
myChart.setOption(option);
});
document.getElementById('tj').innerHTML = '海南省新房均价:{$caty}元/㎡环比上月:-0.69%↓,同比:-0.69%↓';