echart+百度地图在初始化之后动态加数据?为什么地图会刷新?

gj_cong 2017-11-13 03:30:14
var myChart = echarts.init(document.getElementById('map'));
// 基于准备好的dom,初始化echarts实例
// var myChart = echarts.init(document.getElementById('map'));

// 指定图表的配置项和数据

// 使用刚指定的配置项和数据显示图表。


var geoCoorddata = {
'武汉': [114.30539299999998, 30.593099],
'上海': [121.394248,31.156484],
'佛山': [112.92143,22.934428],
'阿克苏': [80.26338699999997, 41.167548]
};
var option = {
bmap: {
center: [108.976073,31.124834],
zoom: 5,
roam: true,
mapStyle: {
styleJson: [{
'featureType': 'land', //调整土地颜色
'elementType': 'geometry',
'stylers': {
'color': '#081734'
}
}, {
'featureType': 'building', //调整建筑物颜色
'elementType': 'geometry',
'stylers': {
'color': '#04406F'
}
}, {
'featureType': 'building', //调整建筑物标签是否可视
'elementType': 'labels',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'highway', //调整高速道路颜色
'elementType': 'geometry',
'stylers': {
'color': '#015B99'
}
}, {
'featureType': 'highway', //调整高速名字是否可视
'elementType': 'labels',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'arterial', //调整一些干道颜色
'elementType': 'geometry',
'stylers': {
'color': '#003051'
}
}, {
'featureType': 'arterial',
'elementType': 'labels',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'green',
'elementType': 'geometry',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'water',
'elementType': 'geometry',
'stylers': {
'color': '#044161'
}
}, {
'featureType': 'subway', //调整地铁颜色
'elementType': 'geometry.stroke',
'stylers': {
'color': '#003051'
}
}, {
'featureType': 'subway',
'elementType': 'labels',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'railway',
'elementType': 'geometry',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'railway',
'elementType': 'labels',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'all', //调整所有的标签的边缘颜色
'elementType': 'labels.text.stroke',
'stylers': {
'color': '#313131'
}
}, {
'featureType': 'all', //调整所有标签的填充颜色
'elementType': 'labels.text.fill',
'stylers': {
'color': '#FFFFFF'
}
}, {
'featureType': 'manmade',
'elementType': 'geometry',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'manmade',
'elementType': 'labels',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'local',
'elementType': 'geometry',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'local',
'elementType': 'labels',
'stylers': {
'visibility': 'off'
}
}, {
'featureType': 'subway',
'elementType': 'geometry',
'stylers': {
'lightness': -65
}
}, {
'featureType': 'railway',
'elementType': 'all',
'stylers': {
'lightness': -40
}
}, {
'featureType': 'boundary',
'elementType': 'geometry',
'stylers': {
'color': '#8b8787',
'weight': '1',
'lightness': -29
}
}]
}
},
series: [{
type: 'lines',
mapType: 'china',
coordinateSystem: 'bmap',
zlevel: 1,
data: [{
//name: '武汉',
// toname: '北京',
coords: [geoCoorddata['佛山'],geoCoorddata['武汉'] ]
}, {
// name: '上海',
// toname: '北京',
coords: [geoCoorddata['佛山'],geoCoorddata['上海']]
}, {
// name: '阿克苏',
// toname: '北京',
coords: [geoCoorddata['佛山'],geoCoorddata['阿克苏']]
}],
//线上面的动态特效
effect: {
show: true,
period: 6,
trailLength: 0.7,
color: '#fff',
symbolSize: 4,
loop:false
},
lineStyle: {
normal: {
width: '',
color: '#a6c84c',
curveness: 0.2
}
}
}, {
type: 'effectScatter',
mapType: 'china',
coordinateSystem: 'bmap',
zlevel: 3,
data: [{
name: '佛山',
value: geoCoorddata['佛山'].concat(200)
}, ],
rippleEffect: {
period: 10,
scale: 5,
brushType: 'fill'
},
}]
};


myChart.setOption(option);


var data=[];
setInterval(function () {
console.log(geoCoorddata['阿克苏']);
data=[{
name: '武汉',

coords: [geoCoorddata['佛山'],geoCoorddata['上海']]
},{
name: '阿克苏',

coords: [geoCoorddata['佛山'],geoCoorddata['阿克苏']]
}];
//运行以下系统会刷新?
myChart.setOption({
series: [{
data: data
}]
})

},6500);


...全文
207 1 点赞 打赏 收藏 举报
写回复
1 条回复
切换为时间正序
当前发帖距今超过3年,不再开放新的回复
发表回复
相关推荐
发帖
JavaScript
加入

8.5w+

社区成员

Web 开发 JavaScript
申请成为版主
帖子事件
创建了帖子
2017-11-13 03:30
社区公告
暂无公告