SOSO地图JavaScript画出标注和中心点

最新推荐文章于 2022-05-09 12:16:00 发布

黑卡米

最新推荐文章于 2022-05-09 12:16:00 发布

阅读量1.7k

点赞数

CC 4.0 BY-SA版权

分类专栏： Vue、JS、CSS 文章标签： SOSO地图 JS JavaScript 标注中心点

本文链接：https://blog.youkuaiyun.com/Aaren_Jiang/article/details/9852381

Vue、JS、CSS 专栏收录该内容

11 篇文章

订阅专栏

本文提供了一个使用HTML5地图API创建本地html文件并运行的示例代码，演示了如何在网页上添加地图并标记两个地点。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

直接贴出代码，这个可以在本地创建一个html文件直接运行：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Map</title>
<script charset="utf-8" src="http://map.soso.com/api/v2/main.js"></script>
<script>
function init() {
 var center = new soso.maps.LatLng(31.15953,121.516035);
 var map = new soso.maps.Map(
    document.getElementById("container"),
    {
        center: center,//显示地图的中心位置
        zoom: 15//显示地图的缩放级别
    }
 );
  
  //地图第一个mark的坐标
  var position1 = new soso.maps.LatLng(31.15751,121.514061);
 
   var marker = new soso.maps.Marker({
    position: position1,
    map: map
   });
   
   //地图第二个mark的坐标
   var position2 = new soso.maps.LatLng(31.160705,121.524017);
 
   var marker = new soso.maps.Marker({
    position: position2,
    map: map
   });
  
}
  
function loadScript() {
  var script = document.createElement("script");
  script.type = "text/javascript";
  script.src = "http://map.soso.com/api/v2/main.js?callback=init";
  document.body.appendChild(script);
}

  
window.onload = loadScript;
</script>
</head>
<body onload="init()">
<div id="container" style="width:1000px; height:800px"></div>
</body>
</html>