sx/map
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

添加组件

Browse Source
This commit is contained in:
Smile-Xin 2025-02-11 17:29:06 +08:00
parent 054e8b629a
commit 5af24a0fce
1 changed files with 17 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/pages/BaseMap/index.js
View File

@ -8,7 +8,7 @@ import Header from '../../components/Header/index.js';
import { createPoint, updatePoint, getDetailByIdApi, queryUserLayers, getLayerPointsApi, getAllProvinceApi, getCityByProvinceApi, getDistrictByCityApi, getLayerShapesApi, getPointByAddressApi, deletePoint } from '../../api'; import { createPoint, updatePoint, getDetailByIdApi, queryUserLayers, getLayerPointsApi, getAllProvinceApi, getCityByProvinceApi, getDistrictByCityApi, getLayerShapesApi, getPointByAddressApi, deletePoint } from '../../api';
import Pop from './pop' import Pop from './pop'
import { GaodeMap, Scene, Heatmap, PolygonLayer, Marker, MarkerLayer, Popup, MouseLocation, CanvasLayer } from '@antv/l7'; import { GaodeMap, Scene, Heatmap, PolygonLayer, Marker, MarkerLayer, Popup, MouseLocation, CanvasLayer, Scale } from '@antv/l7';
const { confirm } = Modal; const { confirm } = Modal;
// import { DrawPoint, DrawEvent } from '@antv/l7-draw'; // import { DrawPoint, DrawEvent } from '@antv/l7-draw';
import icon04 from '../../assets/icon/icon04.svg' import icon04 from '../../assets/icon/icon04.svg'
@ -111,7 +111,7 @@ class BaseMap extends React.Component {
style: 'light', style: 'light',
center: [118.405285, 39.904989], center: [118.405285, 39.904989],
zoom: 3, zoom: 3,
plugin: ['AMap.AutoComplete','AMap.PlaceSearch'], plugin: ['AMap.AutoComplete', 'AMap.PlaceSearch'],
}) })
}); });
@ -141,9 +141,12 @@ class BaseMap extends React.Component {
}); });
// 地图搜索提示功能 // 地图搜索提示功能
scene.on('loaded', () => { scene.on('loaded', () => {
// 比例尺插件
const scale = new Scale();
scene.addControl(scale);
// AutoComplete 插件 // AutoComplete(输入框提示) 插件
window.AMap.plugin(['AMap.AutoComplete','AMap.PlaceSearch'], () => { window.AMap.plugin(['AMap.AutoComplete', 'AMap.PlaceSearch'], () => {
// Autocomplete 实例配置 // Autocomplete 实例配置
const autoOptions = { const autoOptions = {
city: '全国', //城市，默认全国 city: '全国', //城市，默认全国
@ -161,9 +164,16 @@ class BaseMap extends React.Component {
this.state.autoComplete = autoComplete; this.state.autoComplete = autoComplete;
// 监听选中事件，将选中的地址信息显示在输入框中 // 监听选中事件，将选中的地址信息显示在输入框中
autoComplete.on('select', (e) => { autoComplete.on('select', (e) => {
console.log('select', e); let adcode = e.poi.adcode;
console.log('select', e);
this.setState({ this.setState({
inputContent: e.poi.name, inputContent: e.poi.name,
provinceAdcode: adcode.substr(0, 2) + '0000',
}, () => {
// 改变adcode后不自动触发onProvinceChange函数，手动触发
let data = this.state.provinceList.find(o => o.value === this.state.provinceAdcode);
this.onProvinceChange(this.state.provinceAdcode, data);
}) })
}) })
@ -542,7 +552,9 @@ class BaseMap extends React.Component {
} }
// 选择省 provinceAdcode:省编码 data:省数据 // 选择省 provinceAdcode:省编码 data:省数据
onProvinceChange = (provinceAdcode, data) => { onProvinceChange = (provinceAdcode, data) => {
console.log("provinceList", this.state.provinceList)
console.log("data", data) console.log("data", data)
console.log("provinceAdcode", provinceAdcode)
let self = this; let self = this;
// 清除点位图层 // 清除点位图层
let getLayers = self.state.markerLayerList; let getLayers = self.state.markerLayerList;