This commit is contained in:
parent
51886476f0
commit
9f092d797a
|
@ -5,7 +5,10 @@
|
||||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>公共服务一体化驾驶舱</title>
|
<title>公共服务一体化驾驶舱</title>
|
||||||
<script src="https://webapi.amap.com/maps?v=2.0&key=92c48d6015b3c1a023a22506c2581e6d"></script>
|
<script
|
||||||
|
type="text/javascript"
|
||||||
|
src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=2KLQUajGSpNL2DInxT6BwdPklMNpG3hw"
|
||||||
|
></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="amap-container" class="amap-container" />
|
<div id="map"></div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import {
|
import {
|
||||||
|
@ -10,44 +10,26 @@ import {
|
||||||
onBeforeUnmount,
|
onBeforeUnmount,
|
||||||
computed,
|
computed,
|
||||||
} from "vue";
|
} from "vue";
|
||||||
const longAndLat = [119.178783,29.034583];
|
var map = null
|
||||||
const init = () => {
|
const initMap = () => {
|
||||||
var map = new AMap.Map("amap-container", {
|
map = new BMapGL.Map('map', { minZoom: 11, maxZoom: 20 })
|
||||||
// 地图中心位置
|
map.enableScrollWheelZoom(true)
|
||||||
center: longAndLat,
|
map.setMapStyleV2({
|
||||||
resizeEnable: true,
|
styleId: 'd0acde891abd157741b71e12670ee2e6'
|
||||||
// 主题色
|
})
|
||||||
mapStyle: "amap://styles/blue",
|
goMapCenter([119.178783,29.034583], 17)
|
||||||
// 地图层级
|
}
|
||||||
zoom: 12.5,
|
|
||||||
labelDefault:{
|
|
||||||
textStyle:{
|
|
||||||
color:'#fffff',
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
// 实时路况图层
|
|
||||||
var trafficLayer = new AMap.TileLayer.Traffic({
|
|
||||||
zIndex: 10,
|
|
||||||
zooms: [7, 20],
|
|
||||||
});
|
|
||||||
trafficLayer.setMap(map);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
//地图中点
|
||||||
|
const goMapCenter = (point, zoom) => {
|
||||||
|
map.centerAndZoom(new BMapGL.Point(point[0], point[1]), zoom)
|
||||||
|
}
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
init();
|
initMap()
|
||||||
});
|
})
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
::v-deep .amap-logo {
|
::v-deep .anchorBL{
|
||||||
display: none!important; ;
|
display:none;
|
||||||
}
|
}
|
||||||
::v-deep .amap-copyright {
|
|
||||||
bottom:-100px;
|
|
||||||
display: none!important;;
|
|
||||||
}
|
|
||||||
::v-deep .amap-container {
|
|
||||||
/* 调整区域的字体颜色 */
|
|
||||||
color: #ff0000; /* 红色 */
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
Loading…
Reference in New Issue