上一篇: 
下一篇: 
文章来自: 
引用通告: 
Tags: 
最新日志:
不错呦！smile@林凯西，确保“准备文件”中的几个文件都有安装，S...您好，看了您这篇帖子觉得很有帮助。但是有个问题想请...我的修改过了怎么还被恶意注册呢 @jjjjiiii 用PJ快9年了，主要是A...PJ3啊，貌似很少有人用PJ了，现在不是WP就是z...@332347365，我当时接入时错误码没有-10...楼主，ChkValue值应为-103是什么意思呢？...大哥 你最近能看到我发的信息，请跟我联系，我有个制...
HTML5高德地图基本页模板
编辑:dnawo 日期:2022-04-05
复制内容到剪贴板
程序代码
程序代码<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>高德地图基本页</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<style type="text/css">
* {margin:0; padding:0;}
#container {position:absolute; width:100%; height:100%;}
</style>
<!-- 高德地图安全密钥，必须在JSAPI脚本加载之前进行设置，否则设置无效。 -->
<script type="text/javascript">
window._AMapSecurityConfig = {
securityJsCode:'bf6265ecbc9e4ebff9c297369b9b106d',
}
</script>
<script src="https://webapi.amap.com/maps?v=2.0&key=f016c324446cdc91ea3297560d1d5925&plugin=AMap.ControlBar,AMap.ToolBar,AMap.Scale,AMap.HawkEye,AMap.MapType,AMap.Geolocation" type="text/javascript"></script>
</head>
<body>
<div id="container"></div>
<script type="text/javascript">
var map = new AMap.Map('container');
map.setZoomAndCenter(11, [120.149177,30.255714]);
//同步方式加载控件(url需添加plugin参数)
map.addControl(new AMap.ControlBar({position:{top:'10px',left:'10px'}}));
map.addControl(new AMap.ToolBar({position:{top:'110px',left:'40px'}}));
map.addControl(new AMap.Scale());
map.addControl(new AMap.HawkEye({isOpen:false}));
map.addControl(new AMap.MapType());
map.addControl(new AMap.Geolocation({position:{bottom:'40px',left:'10px'}}));
//异步方式加载控件(url无需添加plugin参数)
// AMap.plugin(['AMap.ControlBar','AMap.ToolBar','AMap.Scale','AMap.HawkEye','AMap.MapType','AMap.Geolocation'],
// function(){
// map.addControl(new AMap.ControlBar({position:{top:'10px',left:'10px'}}));
// map.addControl(new AMap.ToolBar({position:{top:'110px',left:'40px'}}));
// map.addControl(new AMap.Scale());
// map.addControl(new AMap.HawkEye({isOpen:false}));
// map.addControl(new AMap.MapType());
// map.addControl(new AMap.Geolocation({position:{bottom:'40px',left:'10px'}}));
// }
// );
</script>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>高德地图基本页</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<style type="text/css">
* {margin:0; padding:0;}
#container {position:absolute; width:100%; height:100%;}
</style>
<!-- 高德地图安全密钥，必须在JSAPI脚本加载之前进行设置，否则设置无效。 -->
<script type="text/javascript">
window._AMapSecurityConfig = {
securityJsCode:'bf6265ecbc9e4ebff9c297369b9b106d',
}
</script>
<script src="https://webapi.amap.com/maps?v=2.0&key=f016c324446cdc91ea3297560d1d5925&plugin=AMap.ControlBar,AMap.ToolBar,AMap.Scale,AMap.HawkEye,AMap.MapType,AMap.Geolocation" type="text/javascript"></script>
</head>
<body>
<div id="container"></div>
<script type="text/javascript">
var map = new AMap.Map('container');
map.setZoomAndCenter(11, [120.149177,30.255714]);
//同步方式加载控件(url需添加plugin参数)
map.addControl(new AMap.ControlBar({position:{top:'10px',left:'10px'}}));
map.addControl(new AMap.ToolBar({position:{top:'110px',left:'40px'}}));
map.addControl(new AMap.Scale());
map.addControl(new AMap.HawkEye({isOpen:false}));
map.addControl(new AMap.MapType());
map.addControl(new AMap.Geolocation({position:{bottom:'40px',left:'10px'}}));
//异步方式加载控件(url无需添加plugin参数)
// AMap.plugin(['AMap.ControlBar','AMap.ToolBar','AMap.Scale','AMap.HawkEye','AMap.MapType','AMap.Geolocation'],
// function(){
// map.addControl(new AMap.ControlBar({position:{top:'10px',left:'10px'}}));
// map.addControl(new AMap.ToolBar({position:{top:'110px',left:'40px'}}));
// map.addControl(new AMap.Scale());
// map.addControl(new AMap.HawkEye({isOpen:false}));
// map.addControl(new AMap.MapType());
// map.addControl(new AMap.Geolocation({position:{bottom:'40px',left:'10px'}}));
// }
// );
</script>
</body>
</html>
说明：高德地图安全密钥和key需到开放平台申请并替换成自己的才能正常使用。
相关链接
[1].高德地图开放平台：https://lbs.amap.com/
评论: 0 | 引用: 0 | 查看次数: 1494
发表评论
请登录后再发表评论！
