Skip to content

B
baidu_map
Commit 6812fbd7 authored by mahui's avatar mahui
Browse files
Options

111

parent 10176464
Show whitespace changes
Inline Side-by-side
Showing with 22 additions and 82 deletions
config/index.js
View file @ 6812fbd7
......@@ -13,7 +13,7 @@ module.exports = {
proxyTable: {},
// Various Dev Server settings
host: '192.168.1.162', // can be overwritten by process.env.HOST
host: '127.0.0.100', // can be overwritten by process.env.HOST
port: 80, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
......
index.html
View file @ 6812fbd7
......@@ -4,7 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>监控</title>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=yu8L3gbGEjjy6VkqsUWE7slPnZoQ6npG"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=yu8L3gbGEjjy6VkqsUWE7slPnZoQ6npG"></script>
</head>
<body>
<div id="app"></div>
......
src/components/map.vue
View file @ 6812fbd7
......@@ -14,11 +14,6 @@
#allmap .anchorBL a {
display: none !important;
}
#allmap path {
fill-opacity: 0 !important;
}
#allmap .BMap_bubble_content {
position: relative !important;
top: 10px !important;
......@@ -154,86 +149,31 @@
},
getBoundary: function(map, bool, index) {
let self = this;
var bdary = new BMap.Boundary();
bdary.get("临安区", function(rs) { //获取行政区域
map.clearOverlays(); //清除地图覆盖物
var count = rs.boundaries.length; //行政区域的点有多少个
let bdary = new BMap.Boundary();
bdary.get('临安区', function (rs) {       //获取行政区域       
const count = rs.boundaries.length;
if (count === 0) {
alert('未能获取当前输入行政区域');
return;
}
var pointArray = [];
for (var i = 0; i < count; i++) {
var ply = new BMap.Polygon(rs.boundaries[i], {
strokeWeight: 5,
strokeColor: "#ff0000"
}); //建立多边形覆盖物
map.addOverlay(ply); //添加覆盖物
pointArray = pointArray.concat(ply.getPath());
}
// map.setViewport(pointArray); //调整视野
if (bool) {
self.keywords = '';
self.api();
} else {
var marker;
return ;
}
const EN_JW = '180, 90;';
const NW_JW = '-180, 90;';
const WS_JW = '-180, -90;';
const SE_JW = '180, -90;';
// 东南西北四个角添加一个覆盖物
const ply1 = new BMap.Polygon(SE_JW + SE_JW + WS_JW + NW_JW + EN_JW + SE_JW + rs.boundaries[0],
{ strokeColor: 'none', fillColor: '#efefef', fillOpacity: 1, strokeOpacity: 1 });
map.addOverlay(ply1);
// 绘制‘临安区’整体的外轮廓
for (let i = 0; i < count; i++) {
const ply = new BMap.Polygon(rs.boundaries[i], {strokeWeight: 2, strokeColor: '#3396fb', fillColor: 'transparent',fillOpacity: 0});
map.addOverlay(ply);
}
let marker;
for (let item of self.search_data) {
marker = new BMap.Point(item.longitude, item.latitude)
self.mapShow(marker, item);
}
}
});
},
change: function(val) {
var username=sessionStorage.getItem('username');
if(JSON.stringify(sessionStorage.getItem(username))=='null'){
return;
}
if (val != '全区') {
this.$parent.town_datail(val);
this.search_data = [];
this.keywords = '';
this.api(val,this.keywords);
}
if (val == '全区') {
this.$parent.town_datail('');
this.api();
}
var coordinate = new BMap.Point(119.352500, 30.234125); // 创建标注
this.map.centerAndZoom(coordinate, 11);
},
api: function(town,position) {
let self = this,data={};
var username=sessionStorage.getItem('username');
if(JSON.stringify(sessionStorage.getItem(username))=='null'){
return;
}
if(town){
data.town=town;
}
if(position){
data.position=position;
}
api.wc.getGcListByTownGcname(data).then(function(data){
if(JSON.stringify(data.gc_list)!='[]'&&data.gc_list.length>0){
self.search_data = [];
self.$parent.town_desc=data.town_desc.town_desc;
for(let item of data.gc_list){
var arr=item.gps.substring(6,item.gps.length-1).split(' ');
item.longitude=parseFloat(arr[0])+0.011296;
item.latitude=parseFloat(arr[1])+0.003085;
// if(item.id==539){
// item.longitude=119.670600;//119.659304 30.239965
// item.latitude=30.243050;
// }
self.search_data.push(item);
}
self.getBoundary(self.map, false, -1);
}
});
},
api(town,position) {
}
}
});
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment