增加元数据接口,
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div id="mapContainer" style="width: 100%; height: 100%;"></div>
|
||||
<div id="mapContainer" style="width: 100%; height: 100%;background-color:rgba(0,211,0,0.6)"></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -11,15 +11,28 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
initializeMap() {
|
||||
var imageURL = "http://t0.tianditu.gov.cn/img_w/wmts?" +
|
||||
"SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
|
||||
"&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=1eb44fae5b9dc454442b322e9a41d233";
|
||||
//创建自定义图层对象
|
||||
var lay = new T.TileLayer(imageURL, {minZoom: 1, maxZoom: 18});
|
||||
var config = {layers: [lay]};
|
||||
// 创建地图对象
|
||||
const map = new T.Map('mapContainer');
|
||||
const map = new T.Map('mapContainer', config);
|
||||
|
||||
// 设置地图中心点和缩放级别
|
||||
map.centerAndZoom(new T.LngLat(116.404, 39.915), 12);
|
||||
|
||||
map.setStyle("indigo")
|
||||
// 添加图层(例如:底图层)
|
||||
// map.addLayer(new T.TileLayer());
|
||||
// map.addLayer(new T.TileLayer());
|
||||
|
||||
const options = new T.Control.OverviewMapOptions();
|
||||
options.anchor = "T_ANCHOR_TOP_RIGHT";
|
||||
options.size = new T.Point(100, 100)
|
||||
options.isOpen = true;
|
||||
|
||||
let a = T.Control.OverviewMap(options)
|
||||
map.addControl(a);
|
||||
let points = [];
|
||||
points.push(new T.LngLat(116.41136, 39.97569));
|
||||
points.push(new T.LngLat(116.411794, 39.9068));
|
||||
@@ -28,18 +41,17 @@ export default {
|
||||
var line = new T.Polyline(points);
|
||||
line.addEventListener('mouseover', this.handleMouseOver);
|
||||
line.addEventListener('mouseout', this.handleMouseOut);
|
||||
|
||||
//向地图上添加线
|
||||
map.addOverLay(line);
|
||||
|
||||
},
|
||||
handleMouseOver(event) {
|
||||
const polyline = event.target;
|
||||
polyline.setColor("red") ; // 鼠标悬停时颜色变为绿色
|
||||
polyline.setColor("red"); // 鼠标悬停时颜色变为绿色
|
||||
},
|
||||
handleMouseOut(event) {
|
||||
const polyline = event.target;
|
||||
polyline.setColor("green") ; // 鼠标悬停时颜色变为绿色
|
||||
polyline.setColor("green"); // 鼠标悬停时颜色变为绿色
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user