地图标点进行轮播

@呵呵

已于 2022-12-06 17:16:53 修改

阅读量300

点赞数

文章标签：地图

于 2022-04-06 09:47:17 首次发布

本文链接：https://blog.csdn.net/weixin_41639609/article/details/123982768

版权

该博客展示了如何使用AntV L7库进行地图初始化，包括禁止地图交互、加载中国地图、设置图层边界和标注。通过动态数据加载，实现了地图上的点标记，并创建了包含任务信息的弹窗，每3秒更新一次标记位置和信息。

摘要由CSDN通过智能技术生成

<div id="map" style="min-height: 1206px; justify-content: center;position: relative"></div>

import {
    Scene, PolygonLayer, LineLayer, PointLayer, Marker, MarkerLayer, Popup } from '@antv/l7';
import {
    Mapbox, GaodeMap } from '@antv/l7-maps';
import {
    ThreeLayer, ThreeRender } from '@antv/l7-three';
import * as THREE from 'three';
methods: {
   
//地图代码部分
	mapInit() {
   
		const scene = new Scene({
   
			id: 'map',
			map: new Mapbox({
   
				pitch: 0,
				style: 'blank',
				center: [116.276227, 35.256776],
				zoom: 11,
				token: "b38fc053583c667837e060ddde845db6",
			}),
			logoVisible: false,
		});
		scene.setMapStatus({
   
			dragEnable: false, // 是否允许地图拖拽
			keyboardEnable: false, // 是否允许形键盘事件
			doubleClickZoom: false, // 双击放大
			zoomEnable: false, // 滚动缩放
			rotateEnable: false // 旋转
		})
	
		scene.on('loaded', () => {
   
			fetch(
					'https://gw.alipayobjects.com/os/bmw-prod/d6da7ac1-8b4f-4a55-93ea-e81aa08f0cf3.json'
				)
				.then(res => res.json())
				.</