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)
}) })
} }
}; };

116
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); // map.addLayer(heatLayer);
// 加载热力图插件 // // 加载热力图插件
// var heatmap; // // var heatmap;
// var points = []; // // var points = [];
// LabelsData.forEach(function (item) { // // LabelsData.forEach(function (item) {
// points.push( // // points.push(
// { // // {
// "lng": Number(item.location.split(',')[0]), // // "lng": Number(item.location.split(',')[0]),
// "lat": Number(item.location.split(',')[1]), // // "lat": Number(item.location.split(',')[1]),
// "count": item.weight, // // "count": item.weight,
// "id": layerId, // // "id": layerId,
// } // // }
// ) // // )
// }) // // })
// map.plugin(["AMap.Heatmap"],function(){ // // map.plugin(["AMap.Heatmap"],function(){
// // 在地图对象叠加热力图 // // // 在地图对象叠加热力图
// heatmap = new AMap.Heatmap(map, { // // heatmap = new AMap.Heatmap(map, {
// radius: 25, //热力图的每个点的半径大小 [0,+∞) // // radius: 25, //热力图的每个点的半径大小 [0,+∞)
// opacity: [0, 0.8], //热力图的透明度,分别对应heatmap.js的minOpacity和maxOpacity // // opacity: [0, 0.8], //热力图的透明度,分别对应heatmap.js的minOpacity和maxOpacity
// gradient:{ //热力图的颜色渐变区间。 {JSON}:key 插值的位置, 0-1; value颜色值 // // gradient:{ //热力图的颜色渐变区间。 {JSON}:key 插值的位置, 0-1; value颜色值
// 0.5: 'blue', // // 0.5: 'blue',
// 0.65: 'rgb(117,211,248)', // // 0.65: 'rgb(117,211,248)',
// 0.7: 'rgb(0, 255, 0)', // // 0.7: 'rgb(0, 255, 0)',
// 0.9: '#ffea00', // // 0.9: '#ffea00',
// 1.0: 'red' // // 1.0: 'red'
// }, // // },
// }); // // });
// // 设置热力图数据集 // // // 设置热力图数据集
// heatmap.setDataSet({data:points,max:100}); // // heatmap.setDataSet({data:points,max:100});
// }); // // });
// this.setState((state) => { // // this.setState((state) => {
// state.heatMapList.push(heatmap); // // 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: {},