<template> <div> <div>这是高德地图,很快</div> <div id="map"></div> </div> </template> <script> import 'ol/ol.css' import View from 'ol/View' import Map from 'ol/Map' import TileLayer from 'ol/layer/Tile' import XYZ from 'ol/source/XYZ'; export default { name: "GaodeMap", mounted() { var layers = [ new TileLayer({ source: new XYZ({ url: 'http://wprd0{1-4}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&style=7&x={x}&y={y}&z={z}' }) }) ] var map = new Map({ layers: layers, target: 'map', view: new View({ center: [118.11, 24.49], zoom: 12, projection: 'EPSG:4326' }) }) } } </script> <style scoped> #map{height: 600px;width: 100%} </style>