<!doctype html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width"> <title>非浙A限行地图</title> <style> html, body, #container { width: 100%;height: 100%; } .button-group { position: fixed;bottom: 20px;right: 20px; } </style> <script src="https://webapi.amap.com/maps?v=2.0&key=你的KEY"></script> <script type="text/javascript" src="https://cache.amap.com/lbs/static/addToolbar.js"></script> </head> <body> <div id="container"></div> <div class="button-group"> <input type="button" class="button" style="background-color: #008000;" value="绿色虚线允许通行"/> <input type="button" class="button" style="background-color: #FF0033;" value="红色实线禁止通行"/> <input type="button" class="button" value="修改颜色" onClick="overlayGroup.setOptions({ fillColor: randomColor(), strokeColor: randomColor(), outlineColor: randomColor() })"/> </div> <script> var map = new AMap.Map('container', { resizeEnable: true, center: [120.182734,30.243627], zoom: 11 }); var lineArrXian = [ [ [120.261716,30.098928], [120.262186,30.103272], [120.259536,30.112237], [120.259877,30.113667], [120.263142,30.118281], [120.265148,30.119293], [120.277105,30.121246], [120.278049,30.121664], [120.285829,30.127686], [120.287648,30.131101], [120.2878,30.13246], [120.28529,30.143307], [120.285735,30.145362], [120.285402,30.163879], [120.286829,30.170571], [120.286877,30.171883], [120.285015,30.180458], [120.285563,30.197838], [120.289339,30.215122], /* 通城高架 */ [120.290642,30.221181], [120.291522,30.225842], [120.291393,30.231292], [120.291865,30.236131], [120.290632,30.245955], [120.290186,30.248542], [120.289511,30.277436], [120.289158,30.298648], [120.293214,30.316877], [120.29345,30.319693], [120.29315,30.324925], [120.295513,30.333615], [120.295771,30.336189], [120.295513,30.333615], [120.29315,30.324925], [120.29345,30.319693], [120.293214,30.316877] /* 通城高架 */ ], [ /* 德胜高架 */ [120.293125,30.316978], [120.32482,30.319947], [120.344518,30.322911], [120.364688,30.322874] /* 德胜高架 */ ] ]; var polylineXian = new AMap.Polyline({ path: lineArrXian, //设置线覆盖物路径 strokeColor: "#FF0000", //线颜色 strokeOpacity: 1, //线透明度 strokeWeight: 5, //线宽 strokeStyle: "solid", //线样式 strokeDasharray: [10, 5] //补充线样式 }); var lineArrTong = [ [ /* 机场高速 */ [120.290689,30.221284], [120.271929,30.223918], [120.265728,30.22358], [120.249892,30.218629], [120.245279,30.217795], [120.23676,30.21709] /* 机场高速 */ ], [ /* 绕城高速西北段 */ [120.261705,30.09888], [120.260857,30.099317], [120.259205,30.100254], [120.258175,30.100783], [120.257145,30.101266], [120.256244,30.101572], [120.254903,30.101897], [120.25295,30.102166], [120.251319,30.102073], [120.24941,30.101897], [120.248605,30.101813], [120.246384,30.101581], [120.241964,30.101117], [120.240118,30.100941], [120.235269,30.100365], [120.233016,30.099966], [120.229518,30.098955], [120.228124,30.098453], [120.227115,30.098045], [120.22572,30.097395], [120.222384,30.095641], [120.221053,30.09488], [120.219777,30.09423], [120.217384,30.093088], [120.213543,30.091724], [120.211075,30.091167], [120.207524,30.090424], [120.202836,30.09021], [120.201344,30.090257], [120.19966,30.090285], [120.198748,30.09034], [120.193534,30.091018], [120.186034,30.0919], [120.181314,30.09261], [120.175727,30.095845], [120.172037,30.102714], [120.169671,30.108543], [120.167365,30.111819], [120.161217,30.116135], [120.147355,30.121257], [120.128734,30.126885], [120.114194,30.131249], [120.102543,30.13573], [120.094247,30.14128], [120.090577,30.146049], [120.08811,30.151819], [120.085845,30.157605], [120.083914,30.160499], [120.077348,30.165155], [120.07517,30.167154], [120.072842,30.169575], [120.06687,30.175541], [120.062214,30.180104], [120.058824,30.184945], [120.057086,30.193829], [120.057965,30.199838], [120.058995,30.206366], [120.061999,30.212893], [120.0623,30.215508], [120.060626,30.219606], [120.057317,30.224056], [120.05427,30.228135], [120.050343,30.233437], [120.046072,30.240629], [120.044141,30.246339], [120.043508,30.25101], [120.043401,30.253642], [120.044218,30.261037], [120.044535,30.262807], [120.044512,30.262932], [120.044844,30.264887], [120.047009,30.278476], [120.047857,30.282988], [120.04893,30.286156], [120.050174,30.289019], [120.051666,30.291854], [120.053554,30.294596], [120.055592,30.297672], [120.057062,30.300256], [120.057642,30.30255], [120.057609,30.30432], [120.057432,30.305538], [120.05636,30.309326], [120.05534,30.313142], [120.054214,30.317319], [120.053463,30.320792], [120.053291,30.323524], [120.053828,30.327766], [120.055319,30.331701], [120.056461,30.333808], [120.057567,30.33572], [120.058849,30.338354], [120.060699,30.343665], [120.061257,30.345618], [120.061804,30.348424], [120.063081,30.352701], [120.064497,30.35521], [120.082509,30.369568], [120.086518,30.373362], [120.086518,30.373362], [120.0945,30.37936], [120.111194,30.385191], [120.123919,30.38571], [120.140239,30.385543], [120.159617,30.388129], [120.161809,30.388175], [120.170027,30.3891], [120.176164,30.390063], [120.182473,30.390063], [120.187151,30.389156], [120.19657,30.385472], [120.204102,30.380678], [120.204102,30.380678], [120.215861,30.372126], [120.224616,30.366035], [120.228934,30.363874], [120.23359,30.361944], [120.238509,30.360254], [120.249335,30.356639], [120.254624,30.354876], [120.259538,30.353209], [120.263915,30.351385], [120.267021,30.349807], [120.27076,30.347904], [120.2729,30.346816], [120.276296,30.34508], [120.278603,30.343951], [120.280695,30.342881], [120.282347,30.342062], [120.282991,30.341761], [120.285035,30.34102], [120.286616,30.340582], [120.289668,30.339693], [120.293614,30.337669], [120.295694,30.336258] /* 绕城高速西北段 */ ] ]; var polylineTong = new AMap.Polyline({ path: lineArrTong, //设置线覆盖物路径 strokeColor: "#008000", //线颜色 strokeOpacity: 1, //线透明度 strokeWeight: 5, //线宽 strokeStyle: "dashed", //线样式 strokeDasharray: [10, 5] //补充线样式 }); var path = [ /* 非浙A限行区域 */ [120.086518,30.373362], [120.0945,30.37936], [120.111194,30.385191], [120.123919,30.38571], [120.140239,30.385543], [120.159617,30.388129], [120.161809,30.388175], [120.170027,30.3891], [120.176164,30.390063], [120.182473,30.390063], [120.187151,30.389156], [120.19657,30.385472], [120.204102,30.380678], [120.204102,30.380678], [120.215861,30.372126], [120.224616,30.366035], [120.228934,30.363874], [120.23359,30.361944], [120.238509,30.360254], [120.249335,30.356639], [120.254624,30.354876], [120.259538,30.353209], [120.263915,30.351385], [120.267021,30.349807], [120.27076,30.347904], [120.2729,30.346816], [120.276296,30.34508], [120.278603,30.343951], [120.280695,30.342881], [120.282347,30.342062], [120.282991,30.341761], [120.285035,30.34102], [120.286616,30.340582], [120.289668,30.339693], [120.292463,30.338462], [120.29499,30.336883], [120.295837,30.336202], [120.295368,30.333251], [120.29451,30.330131], [120.293383,30.326473], [120.293147,30.324435], [120.293362,30.320203], [120.289177,30.297677], [120.289285,30.290007], [120.289499,30.280445], [120.289585,30.275424], [120.290089,30.256641], [120.290143,30.252285], [120.290197,30.249078], [120.29127,30.241969], [120.291752,30.238855], [120.291988,30.236213], [120.291752,30.234313], [120.29143,30.230522], [120.291581,30.228056], [120.291591,30.22597], [120.291119,30.222485], [120.289617,30.216496], [120.287429,30.20626], [120.285905,30.199843], [120.285422,30.194873], [120.285154,30.19045], [120.28509,30.187445], [120.285015,30.181649], [120.285143,30.1801], [120.285626,30.177605], [120.286785,30.172838], [120.286924,30.171474], [120.286474,30.168849], [120.285851,30.166178], [120.285433,30.163747], [120.285562,30.158797], [120.285594,30.154891], [120.285691,30.151227], [120.285766,30.148694], [120.285685,30.145322], [120.285471,30.1447], [120.285363,30.142965], [120.28605,30.140015], [120.286629,30.137575], [120.286941,30.136322], [120.287756,30.13287], [120.28767,30.131144], [120.287123,30.129873], [120.286404,30.128463], [120.285798,30.127674], [120.284591,30.126695], [120.282989,30.125452], [120.281262,30.124107], [120.279456,30.122701], [120.276891,30.121161], [120.273877,30.120687], [120.269767,30.12001], [120.265905,30.119416], [120.264542,30.119091], [120.263008,30.1182], [120.262343,30.117319], [120.261474,30.116094], [120.260513,30.114737], [120.260052,30.114027], [120.259692,30.113052], [120.259687,30.113164], [120.259622,30.112236], [120.260159,30.110556], [120.260985,30.108505], [120.261693,30.106667], [120.262079,30.105256], [120.262144,30.102694], [120.2618,30.100337], [120.261705,30.09888], [120.260857,30.099317], [120.259205,30.100254], [120.258175,30.100783], [120.257145,30.101266], [120.256244,30.101572], [120.254903,30.101897], [120.25295,30.102166], [120.251319,30.102073], [120.24941,30.101897], [120.248605,30.101813], [120.246384,30.101581], [120.241964,30.101117], [120.240118,30.100941], [120.235269,30.100365], [120.233016,30.099966], [120.229518,30.098955], [120.228124,30.098453], [120.227115,30.098045], [120.22572,30.097395], [120.222384,30.095641], [120.221053,30.09488], [120.219777,30.09423], [120.217384,30.093088], [120.213543,30.091724], [120.211075,30.091167], [120.207524,30.090424], [120.202836,30.09021], [120.201344,30.090257], [120.19966,30.090285], [120.198748,30.09034], [120.193534,30.091018], [120.186034,30.0919], [120.181314,30.09261], [120.175727,30.095845], [120.172037,30.102714], [120.169671,30.108543], [120.167365,30.111819], [120.161217,30.116135], [120.147355,30.121257], [120.128734,30.126885], [120.114194,30.131249], [120.102543,30.13573], [120.094247,30.14128], [120.090577,30.146049], [120.08811,30.151819], [120.085845,30.157605], [120.083914,30.160499], [120.077348,30.165155], [120.07517,30.167154], [120.072842,30.169575], [120.06687,30.175541], [120.062214,30.180104], [120.058824,30.184945], [120.057086,30.193829], [120.057965,30.199838], [120.058995,30.206366], [120.061999,30.212893], [120.0623,30.215508], [120.060626,30.219606], [120.057317,30.224056], [120.05427,30.228135], [120.050343,30.233437], [120.046072,30.240629], [120.044141,30.246339], [120.043508,30.25101], [120.043401,30.253642], [120.044218,30.261037], [120.044535,30.262807], [120.044512,30.262932], [120.044844,30.264887], [120.047009,30.278476], [120.047857,30.282988], [120.04893,30.286156], [120.050174,30.289019], [120.051666,30.291854], [120.053554,30.294596], [120.055592,30.297672], [120.057062,30.300256], [120.057642,30.30255], [120.057609,30.30432], [120.057432,30.305538], [120.05636,30.309326], [120.05534,30.313142], [120.054214,30.317319], [120.053463,30.320792], [120.053291,30.323524], [120.053828,30.327766], [120.055319,30.331701], [120.056461,30.333808], [120.057567,30.33572], [120.058849,30.338354], [120.060699,30.343665], [120.061257,30.345618], [120.061804,30.348424], [120.063081,30.352701], [120.064497,30.35521], [120.082509,30.369568] /* 非浙A限行区域 */ ] var polygon = new AMap.Polygon({ path: path, strokeColor: "#008000", strokeWeight: 6, strokeOpacity: 0.2, fillOpacity: 0.4, fillColor: '#FFCC33', zIndex: 50, }) var overlayGroup = new AMap.OverlayGroup([ polylineXian, polygon, polylineTong]) map.add(overlayGroup); function randomColor() { return '#' + (Math.random() * 0xffffff<<0).toString(16) } </script> </body> </html>
红色实线禁止通行
绿色虚线允许通行
WEB空间升级为SSL(https)后,定位还是存在问题, 第一次能打开定位,刷新几次后将看不到定位.
问题已经解决: 看例子 http://www.wmdfw.com/ditu.php