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

创建图层和点位后刷新

Browse Source
This commit is contained in:
licuizhu 2024-02-27 16:36:00 +08:00
parent 6bf37b1614
commit c03cd48ae1
3 changed files with 69 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/index.less
View File

@ -222,8 +222,9 @@ body {
top: -1px; top: -1px;
} }
.ant-tree-iconEle > span:last-child img { .ant-tree-iconEle > span:last-child img {
width: 100%; width: auto;
height: 100%; height: 100%;
margin-top: 6px;
} }
.ant-tree .ant-tree-treenode-disabled .ant-tree-node-content-wrapper { .ant-tree .ant-tree-treenode-disabled .ant-tree-node-content-wrapper {
color: inherit; color: inherit;

11
src/pages/BaseMap/LayerData/index.js
View File

@ -41,7 +41,7 @@ class LayerData extends React.Component {
key: basicLayeData[i].id, key: basicLayeData[i].id,
title : basicLayeData[i].name, title : basicLayeData[i].name,
selectable: false, selectable: false,
children: this.getLayerList(basicLayeData[i].layerList, i), children: this.getLayerList(basicLayeData[i].layerList),
}) })
} }
this.setState ({ this.setState ({
@ -105,6 +105,8 @@ class LayerData extends React.Component {
}); });
}; };
handleOk = (values) => { handleOk = (values) => {
let self = this;
let treeData = this.state.treeData
if (this.state.addLayer.id != 0) { //编辑图层 if (this.state.addLayer.id != 0) { //编辑图层
updateLayer({ updateLayer({
id: this.state.addLayer.id, id: this.state.addLayer.id,
@ -126,13 +128,16 @@ class LayerData extends React.Component {
note: this.state.addLayer.note, note: this.state.addLayer.note,
}).then((e) => { }).then((e) => {
if (e.success) { if (e.success) {
message.success('图层创建成功!'); message.success(e.message || '图层创建成功!');
this.setState({ this.setState({
isModalOpen: false isModalOpen: false
}); });
} else { } else {
message.error('图层创建失败！'); message.error(e.message || '图层创建失败！');
} }
}).then(() => {
let filter = self.props.adcode.districtAdcode || self.props.adcode.cityAdcode;
self.getBasicLayerMenu(filter)
}) })
} }
}; };

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

@ -193,64 +193,64 @@ class BaseMap extends React.Component{
} }
// 在地图上设置热力图 【经度，纬度】 // 在地图上设置热力图 【经度，纬度】
setHeatMap = (data, layerId) => { // setHeatMap = (data, layerId) => {
let self = this; // let self = this;
let map = this.state.map; // let map = this.state.map;
let LabelsData = data || []; // let LabelsData = data || [];
let heatLayer = new Heatmap({nmae: layerId}) // let heatLayer = new Heatmap({nmae: layerId})
.source(LabelsData) // .source(LabelsData)
.shape('heatmap') // .shape('heatmap')
.size('mag', [ 0, 1.0 ]) // weight映射通道 // .size('mag', [ 0, 1.0 ]) // weight映射通道
.style({ // .style({
intensity: 2, // intensity: 2,
radius: 20, // radius: 20,
rampColors: { // rampColors: {
colors: [ // colors: [
'#FF4818', // '#FF4818',
'#F7B74A', // '#F7B74A',
'#FFF598', // '#FFF598',
'#91EABC', // '#91EABC',
'#2EA9A1', // '#2EA9A1',
'#206C7C' // '#206C7C'
].reverse(), // ].reverse(),
positions: [ 0, 0.2, 0.4, 0.6, 0.8, 1.0 ] // positions: [ 0, 0.2, 0.4, 0.6, 0.8, 1.0 ]
}
});
map.addLayer(heatLayer);
// 加载热力图插件
// var heatmap;
// var points = [];
// LabelsData.forEach(function (item) {
// points.push(
// {
// "lng": Number(item.location.split(',')[0]),
// "lat": Number(item.location.split(',')[1]),
// "count": item.weight,
// "id": layerId,
// } // }
// )
// })
// map.plugin(["AMap.Heatmap"],function(){
// // 在地图对象叠加热力图
// heatmap = new AMap.Heatmap(map, {
// radius: 25, //热力图的每个点的半径大小 [0,+∞)
// opacity: [0, 0.8], //热力图的透明度,分别对应heatmap.js的minOpacity和maxOpacity
// gradient:{ //热力图的颜色渐变区间。 {JSON}:key 插值的位置, 0-1; value颜色值
// 0.5: 'blue',
// 0.65: 'rgb(117,211,248)',
// 0.7: 'rgb(0, 255, 0)',
// 0.9: '#ffea00',
// 1.0: 'red'
// },
// }); // });
// // 设置热力图数据集 // map.addLayer(heatLayer);
// heatmap.setDataSet({data:points,max:100});
// }); // // 加载热力图插件
// this.setState((state) => { // // var heatmap;
// state.heatMapList.push(heatmap); // // var points = [];
// }); // // LabelsData.forEach(function (item) {
} // // points.push(
// // {
// // "lng": Number(item.location.split(',')[0]),
// // "lat": Number(item.location.split(',')[1]),
// // "count": item.weight,
// // "id": layerId,
// // }
// // )
// // })
// // map.plugin(["AMap.Heatmap"],function(){
// // // 在地图对象叠加热力图
// // heatmap = new AMap.Heatmap(map, {
// // radius: 25, //热力图的每个点的半径大小 [0,+∞)
// // opacity: [0, 0.8], //热力图的透明度,分别对应heatmap.js的minOpacity和maxOpacity
// // gradient:{ //热力图的颜色渐变区间。 {JSON}:key 插值的位置, 0-1; value颜色值
// // 0.5: 'blue',
// // 0.65: 'rgb(117,211,248)',
// // 0.7: 'rgb(0, 255, 0)',
// // 0.9: '#ffea00',
// // 1.0: 'red'
// // },
// // });
// // // 设置热力图数据集
// // heatmap.setDataSet({data:points,max:100});
// // });
// // this.setState((state) => {
// // state.heatMapList.push(heatmap);
// // });
// }
// 获取围栏图层数据 // 获取围栏图层数据
getLayerShapes = (layerId, selected, adcode) => { getLayerShapes = (layerId, selected, adcode) => {
if (selected) { if (selected) {
@ -604,6 +604,8 @@ class BaseMap extends React.Component{
this.getLayerPoints(layerId, true, 1); this.getLayerPoints(layerId, true, 1);
this.refs.getLayerDataFun.changeUnitAmount(this.state.pointAdd.layerId); this.refs.getLayerDataFun.changeUnitAmount(this.state.pointAdd.layerId);
}, 1000);//true新增，1点 }, 1000);//true新增，1点
let filter = this.state.districtAdcode || this.state.cityAdcode;
this.refs.getLayerDataFun.getBasicLayerMenu(filter)
this.setState({ this.setState({
isModalOpen: false, isModalOpen: false,
pointAdd: {}, pointAdd: {},