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

Openlayers 如何从geojson数据添加openlayer 6热图层,openlayers,geojson,openlayers-3,openlayers-6,Openlayers,Geojson,Openlayers 3,Openlayers 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'

我正在尝试使用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",
    extent: extent,
    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',
              'geometry': {
                'type': 'Point',
                'coordinates': [686213.47091037, 1093486.3776117],
              },
              'properties': {'title': 'HeatmapPts','id':222,'name':'sample 2'},
            },
            {
              'type': 'Feature',
              'geometry': {
                'type': 'Point',
                'coordinates': [687067.04391223, 1094462.7275206],
              },
              'properties': {'title': 'HeatmapPts','id':333,'name':'sample 3'},
            },
            {
              'type': 'Feature',
              'geometry': {
                'type': 'Point',
                'coordinates': [715175.426212967, 940887.9894195743],
              },
              'properties': {'title': 'HeatmapPts','id':444,'name':'sample 4'},
            },
            {
              'type': 'Feature',
              'geometry': {
                'type': 'Point',
                'coordinates': [715199.78960381, 940877.6180225],
              },
              'properties': {'title': 'HeatmapPts','id':555,'name':'sample 5'},
            },
            {
              'type': 'Feature',
              'geometry': {
                'type': 'Point',
                'coordinates': [687214.60645801, 1094362.868384],
              },
              'properties': {'title': 'HeatmapPts','id':666,'name':'sample 6'},
            },
            {
              'type': 'Feature',
              'geometry': {
                'type': 'Point',
                'coordinates': [614971.473,1218630.894 ],
              },
              'properties': {'title': 'HeatmapPts','id':777,'name':'sample 7'},
            },
            {
              'type': 'Feature',
              'geometry': {
                'type': 'Point',
                'coordinates': [620197.188,1222790.136],
              },
              'properties': {'title': 'HeatmapPts','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, 10),
          //weight: 10,  //Results in Uncaught TypeError: this.weightFunction_ is not a function
        });
   mapp.addLayer(heatmaplayer);
});
但这并没有在地图上显示任何东西。如何在热图中添加GEOJSON中的数据?

从@Mike:-)获得的数据
问题是重量、模糊和半径

地图没有视图。如果您将功能保留在EPSG:32643中,您的视图也需要是EPSG:32643,并且您需要在proj4中定义并注册它,以允许重新投影OSM层。它具有视图和其他层。我已经更新了问题当我向热图添加
weight:10,
时,它会导致错误未捕获类型错误:this.weightFunction\uu不是一个函数您已经将模糊和半径定义为数字变量,它们没有值属性。权重必须是一个函数或功能属性的名称。是的,我知道了。。我已经修改了模糊,半径和重量作为你给和得到它@迈克非常感谢:-)