如何从geojson数据添加openlayer 6热图图层

问题描述

我正在尝试使用GEOJSON数据在ol6中添加热图（单击按钮时）。我的任何东西都没有显示在地图上，添加了图层，但没有显示热图。 我的map.js是

import {Map,View} from 'ol';
import TileLayer from 'ol/layer/Tile';
import OSM from 'ol/source/OSM';
import {Map,View} from 'ol';
import {Heatmap as HeatmapLayer} from 'ol/layer';

proj4.defs("EPSG:32643","+proj=utm +zone=43 +datum=wgs84 +units=m +no_defs");
register(proj4);
    
var extent = [291627,904686,958569,1571628];
var projection = new Projection({
  code: 'EPSG:32643',extent: extent,});
var map = new Map({
  target: 'map',layers: [
    new TileLayer({
      title: 'OSM',source: new OSM(),opacity: 0.5,}),new TileLayer({
       title: 'Sample',source: new XYZ({
           url: "http://127.0.0.1:8080/tms/1.0.0/sample/samplegrid" + "/{z}/{x}/{-y}.png",crossOrigin: "anonymous",projection:projection,tileGrid: createXYZ({
                  extent: extent,maxResolution: 2605.2421875,tileSize: [256,256],maxZoom: 13,],view: new View({
    projection: projection,units:"metric",zoom:0,maxZoom:13,minZoom:0,maxResolution:2605.2421875,center:[654496.136597752,1155181.26900064],numZoomLevels:13,})
}); 

//***on button click***
$( "#heatmap" ).click(function() {

//---geojson data for heatmap---
    var heatmap_data = {
          "type": "FeatureCollection",'features': [
            {
              'type': 'Feature','geometry': {
                'type': 'Point','coordinates': [716015.7709315167,941114.3812981017],},'properties': {'title': 'HeatmapPts','id':111,'name':'sample 1'},{
              'type': 'Feature','coordinates': [686213.47091037,1093486.3776117],'id':222,'name':'sample 2'},'coordinates': [687067.04391223,1094462.7275206],'id':333,'name':'sample 3'},'coordinates': [715175.426212967,940887.9894195743],'id':444,'name':'sample 4'},'coordinates': [715199.78960381,940877.6180225],'id':555,'name':'sample 5'},'coordinates': [687214.60645801,1094362.868384],'id':666,'name':'sample 6'},'coordinates': [614971.473,1218630.894 ],'id':777,'name':'sample 7'},'coordinates': [620197.188,1222790.136],'id':888,'name':'sample 8'},}

            ],};
    var heatfeature = new VectorSource({
          features: new GeoJSON().readFeatures(heatmap_data,{
            dataProjection: 'EPSG:32643',featureProjection: 'EPSG:32643',var blur = 20;
   var radius = 10;
   var heatmaplayer = new HeatmapLayer({
          title:'HeatMap',source: heatfeature,blur: parseInt(blur.value,10),radius: parseInt(radius.value,//weight: 10,//Results in Uncaught TypeError: this.weightFunction_ is not a function
        });
   mapp.addLayer(heatmaplayer);
});

但这未在地图上显示任何内容。如何在热图中从GEOJSON添加数据？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）