Openlayers v6.x 学习记录（一）初步上手

℡前路漫漫

于 2022-01-15 14:51:11 发布

阅读量410

点赞数

CC 4.0 BY-SA版权

分类专栏： Openlayers 6.x学习文章标签： vue.js

本文链接：https://blog.youkuaiyun.com/sdkdlingfeng/article/details/122509961

资源：

1、官网：OpenLayers - Welcome

2、框架: Vue.js

环境搭建

1、安装 OpenLayers 最新插件

npm install -save ol

安装之前的版本：npm install -save ol@5.3.0

2、加载地图瓦片

<template>
  <div id="map"></div>
</template>
import 'ol/ol.css';
import {Feature, Map, View} from "ol";
export default {
  name: "himap",
  props: {},
  data() {
    return {
      map: null
    }
  },
  created() {
    
  },
  mounted() {
    this.map = new Map({
      target: "map",
      layers: [
        new TileLayer({
         source: new OSM()
        })
      ],
      view: new View({
        projection: "EPSG:4326",    //使用这个坐标系 WGS84
        center: [120.377607,36.066643], //青岛
        zoo

最低0.47元/天解锁文章