地圖初始化

引入 mapPlus 到你的專案,開始開發地圖

使用 CDN 標籤引入,並於註冊頁面取得專屬的 Key 和 Token 後,即可開始建立地圖。

使用 CDN 引入

於頁面 <head/> 標籤中引入 mapPlus。

html
<script src="https://kw3dmap.localking.com.tw/openapi/loader/mapPlus-1.4.8.loader.js" crossorigin="anonymous" referrerpolicy="origin"></script>

快速開始:

html
<!DOCTYPE html><html>
<head><meta charset=utf-8 /><title>Kingway Map</title><meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" /><script src="https://kw3dmap.localking.com.tw/openapi/loader/mapPlus-1.4.8.loader.js" crossorigin="anonymous" referrerpolicy="origin"></script><style>  body { margin: 0; padding: 0; }  #map { width: 100vw; height: 100vh; }</style></head>
<body><div id="map"></div><script type="module">  const map = await new mapPlus(document.getElementById('map'), {    accessKey: 'get_your_key',    accessToken: 'get_your_token',    style: 'https://kw3dmap.localking.com.tw/openapi/map/kwmap.etxt',    center: [121.53559860212545, 25.029308142529132],  });
  map.on('style.load', () => {    // 可以開始調用 map  });</script></body>
</html>