image.png
百度地圖做一個(gè)demo進(jìn)來很簡單歧匈，接入數(shù)據(jù)的時(shí)候也不難 但是提測的時(shí)候一堆bug,當(dāng)時(shí)就懵了
image.png
其實(shí)原本我是不想用echarts+百度地圖做這個(gè)東西的
但是看上圖，百度地圖沒有這個(gè)拉桿拉動(dòng)的時(shí)候顯示，熱力的變換（在echarts中是visualMap插件）
于是沒辦法 才想到了結(jié)合echarts使用
但是測試提的第一個(gè)bug就是拉動(dòng)這個(gè)visualMap的時(shí)候恭理，地圖會(huì)跟著動(dòng)殉挽，
找了n多方法，先是禁掉地圖的所有拉伸裳擎，雙擊涎永，滾輪事件，但是沒用鹿响，拉伸visualMap 的時(shí)候還是會(huì)動(dòng)羡微，在一度以為解決不了的時(shí)候，試了一個(gè)方法搞定就是把BMap插件的roam:true改成roam:false
這個(gè)方法就是echarts結(jié)合百度地圖使用的插件 BMap我在上面介紹的如何使用echarts百度地圖熱力圖里面有介紹惶我，http://www.reibang.com/p/deaf251f7e57
bmap: {
center: [117.1843390000, 34.2094400000],
zoom: 17,
roam: false //這個(gè)地方改成false
},
這就可以了 隨便拉伸都不會(huì)動(dòng)了
第二個(gè)問題是我做人流遷移圖的時(shí)候背景妈倔，說是要黑色的，這個(gè)還是簡單的
var mapStyle = {
features: ["road", "building", "water", "land"],//隱藏地圖上的"poi",
style: "dark",
};
this.map.setMapStyle(mapStyle);
第三個(gè)問題適配的問題
百度地圖不知道你要顯示的地圖是多大面積所以在小屏上顯示的時(shí)候熱力圖有數(shù)據(jù)的時(shí)候會(huì)超出你的容器绸贡，用戶體驗(yàn)不好盯蝴，而你的拉伸，雙擊听怕，滾輪事件都因?yàn)?roam: false 而失效了捧挺，這個(gè)時(shí)候本來是沒有解決辦法的，所以和產(chǎn)品商量決定加兩個(gè)按鈕尿瞭，控制地圖的放大和縮小
image.png
getBigMap(){
this.map.zoomIn()
},
getSmallMap(){
this.map.zoomOut()
},
曲線救國
