vue2-maptalks

vue2-maptalks 是 vue 和 maptalks 的实现

Links

API 文档

安装

npm or yarn

# npm
npm i vue2-maptalks maptalks -S
# yarn
yarn add vue2-maptalks maptalks

使用

// main.js
import Vue from 'vue';
import {Vue2Maptalks} from 'vue2-maptalks';
import 'maptalks/dist/maptalks.css';

Vue.use(Vue2Maptalks);

<div>
  <div class="map">
    <mt-map :options="mapOptions">
      <mt-tile-layer
        id="tile"
        url-template="https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png"
        :subdomains="['a','b','c','d']"
      ></mt-tile-layer>

      <mt-scale></mt-scale>
      <mt-zoom></mt-zoom>
      
      <mt-vector-layer id="vector">
        <mt-marker :coordinates="[-0.113049, 51.498568]">
          <mt-info-window title="infoWindow">
            <div>info body</div>
          </mt-info-window>
        </mt-marker>
      </mt-vector-layer>
    </mt-map>
  </div>
</div>

<script>
export default {
  data() {
    return {
      mapOptions: {
        zoom: 13,
        center: [-0.113049, 51.498568],
      },
    }
  }
}
</script>

开发

git clone https://github.com/sxyhappy/vue2-maptalks.git
cd vue2-maptalks

# install dependencies
npm install
# or
yarn

# run dev
npm run dev

LICENSE

MIT