<template> <div> <div>中国省级行政区划图</div> <div id="map" class="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 TileWMS from 'ol/source/TileWMS'; export default { name: "ChinaMap2", mounted() { var layers = [ new TileLayer({ extent: [// 边界 73.44696044921875, 6.318641185760498, 135.08583068847656, 53.557926177978516 ], source: new TileWMS({ url: "http://localhost:8080/geoserver/china/wms", params: { LAYERS: "china:bou2_4p", TILED: true }, serverType: "geoserver", transition: 0 }) }) ] var map = new Map({ layers: layers, target: 'map', view: new View({ center: [114.51, 36.49], zoom: 4, projection: 'EPSG:4326' }) }) } } </script> <style scoped> #map{height: 600px;width: 100%} </style>
VUE+OPENLAYER系列四:Geoserver 1
最新推荐文章于 2024-07-09 00:00:00 发布