feat:地图
Showing
2 changed files
with
40 additions
and
19 deletions
1 | $('.area_list li').click(function(){ | 1 | $('.area_list li').click(function () { |
2 | $(".area_list li").removeClass("active1") | 2 | $(".area_list li").removeClass("active1") |
3 | $(this).addClass("active1"); | 3 | $(this).addClass("active1"); |
4 | 4 | ||
5 | }) | 5 | }) |
6 | 6 | ||
7 | $(".single_input").on("click",function(){ | 7 | $(".single_input").on("click", function () { |
8 | var par_label = $(this).parent(); | 8 | var par_label = $(this).parent(); |
9 | if(this.checked){ | 9 | if (this.checked) { |
10 | $(".input_label").removeClass("choose_radioed").addClass("choose_radio"); | 10 | $(".input_label").removeClass("choose_radioed").addClass("choose_radio"); |
11 | par_label.removeClass("choose_radio").addClass("choose_radioed"); | 11 | par_label.removeClass("choose_radio").addClass("choose_radioed"); |
12 | }else{ | 12 | } else { |
13 | } | 13 | } |
14 | }); | 14 | }); |
15 | 15 | ||
... | @@ -41,18 +41,18 @@ layui.use(['form', 'common'], function () { | ... | @@ -41,18 +41,18 @@ layui.use(['form', 'common'], function () { |
41 | }); | 41 | }); |
42 | //办事大厅 | 42 | //办事大厅 |
43 | form.on('select(officehall)', function (data) { | 43 | form.on('select(officehall)', function (data) { |
44 | let latitude= undefined | 44 | let latitude = undefined |
45 | let longitude= undefined | 45 | let longitude = undefined |
46 | let title= '' | 46 | let title = '' |
47 | if(data.value==1) { | 47 | if (data.value == 1) { |
48 | latitude = 116.397469 | 48 | latitude = 116.397469 |
49 | longitude = 39.908821 | 49 | longitude = 39.908821 |
50 | title = '北京' | 50 | title = '北京' |
51 | }else if(data.value==2){ | 51 | } else if (data.value == 2) { |
52 | latitude = 121.491119 | 52 | latitude = 121.491119 |
53 | longitude = 31.235172 | 53 | longitude = 31.235172 |
54 | title = '上海' | 54 | title = '上海' |
55 | }else { | 55 | } else { |
56 | latitude = 120.21201 | 56 | latitude = 120.21201 |
57 | longitude = 30.2084 | 57 | longitude = 30.2084 |
58 | title = '杭州' | 58 | title = '杭州' |
... | @@ -90,17 +90,39 @@ geolocation.getCurrentPosition(function (r) { | ... | @@ -90,17 +90,39 @@ geolocation.getCurrentPosition(function (r) { |
90 | } | 90 | } |
91 | }, { enableHighAccuracy: true }); | 91 | }, { enableHighAccuracy: true }); |
92 | 92 | ||
93 | var map = new BMapGL.Map('container'); | 93 | |
94 | var point = new BMapGL.Point(108.95309828, 34.2777999); | 94 | var map = new BMap.Map('container'); |
95 | map.centerAndZoom(point, 15); | 95 | var point = new BMap.Point(108.95309828, 34.2777999); |
96 | map.centerAndZoom(point, 20); | ||
97 | |||
98 | |||
99 | var cityName = '陕西省'; | ||
100 | map.centerAndZoom(cityName, 15); // 初始化地图,设置中心点坐标和地图级别。 map.addControl(new BMap.ScaleControl()); // 添加比例尺控件 | ||
101 | map.addControl(new BMap.OverviewMapControl()); //添加缩略地图控件 | ||
102 | map.enableScrollWheelZoom(); | ||
103 | map.addControl(new BMap.NavigationControl({ type: BMAP_NAVIGATION_CONTROL_LARGE, anchor: BMAP_ANCHOR_TOP_LEFT, offset: new BMap.Size(40, 250) })); | ||
104 | var bdary = new BMap.Boundary(); | ||
105 | bdary.get(cityName, function (rs) { //获取行政区域 | ||
106 | var EN_JW = "180, 90;"; //东北角 | ||
107 | var NW_JW = "-180, 90;"; //西北角 | ||
108 | var WS_JW = "-180, -90;"; //西南角 | ||
109 | var SE_JW = "180, -90;"; //东南角 | ||
110 | //4.添加环形遮罩层 | ||
111 | var ply1 = new BMap.Polygon(rs.boundaries[0] + SE_JW + SE_JW + WS_JW + NW_JW + EN_JW + SE_JW, { strokeColor: "none", fillColor: "rgb(246,246,246)", fillOpacity: 1, strokeOpacity: 0.5 }); //建立多边形覆盖物 | ||
112 | |||
113 | map.addOverlay(ply1); | ||
114 | //5. 给目标行政区划添加边框,其实就是给目标行政区划添加一个没有填充物的遮罩层 | ||
115 | var ply = new BMap.Polygon(rs.boundaries[0], { strokeWeight: 2, strokeColor: "#00f", fillColor: "" }); | ||
116 | map.addOverlay(ply); | ||
117 | //map.setViewport(ply.getPath()); //调整视野 | ||
118 | }); | ||
119 | |||
96 | var opts = { | 120 | var opts = { |
97 | width: 100, | 121 | width: 100, |
98 | height: 60, | 122 | height: 60, |
99 | title: '办事大厅' | 123 | title: '办事大厅' |
100 | }; | 124 | }; |
101 | var infoWindow = new BMapGL.InfoWindow('雁塔区南二环西段', opts); | 125 | var infoWindow = new BMap.InfoWindow('雁塔区南二环西段', opts); |
102 | map.openInfoWindow(infoWindow, point); | 126 | map.openInfoWindow(infoWindow, point); |
103 | 127 | map.centerAndZoom(new BMap.Point(108.95309828, 34.2777999), 15); // 初始化地图,设置中心点坐标和地图级别 | |
104 | |||
105 | map.centerAndZoom(new BMapGL.Point(108.95309828, 34.2777999), 12); // 初始化地图,设置中心点坐标和地图级别 | ||
106 | map.enableScrollWheelZoom(true); // 开启鼠标滚轮缩放 | 128 | map.enableScrollWheelZoom(true); // 开启鼠标滚轮缩放 |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -13,7 +13,6 @@ | ... | @@ -13,7 +13,6 @@ |
13 | <link rel='icon' href='favicon.ico' type='image/x-ico' /> | 13 | <link rel='icon' href='favicon.ico' type='image/x-ico' /> |
14 | <meta name="description" content="" /> | 14 | <meta name="description" content="" /> |
15 | <meta name="keywords" content="" /> | 15 | <meta name="keywords" content="" /> |
16 | <script src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=0NWXXsCSawnWID4UYI7Uhrl9WgtI2IGs"></script> | ||
17 | <script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=0NWXXsCSawnWID4UYI7Uhrl9WgtI2IGs"></script> | 16 | <script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=0NWXXsCSawnWID4UYI7Uhrl9WgtI2IGs"></script> |
18 | <link rel="stylesheet" type="text/css" href="../../staticCss/common.css" /> | 17 | <link rel="stylesheet" type="text/css" href="../../staticCss/common.css" /> |
19 | <link rel="stylesheet" type="text/css" href="../../staticLib/layui/css/layui.css" /> | 18 | <link rel="stylesheet" type="text/css" href="../../staticLib/layui/css/layui.css" /> | ... | ... |
-
Please register or sign in to post a comment