标签：box h337 data js arcgis 000 config any view

arcgis js 4 自带的热力图只能用于mapView， 对于sceneView 只能用别的方法来构建，对于最新arcgis api dojo 已经全部清除
之前热力图构建方法失效，于是乎重新改代码

其中Point 是esri 的Point 可以预先加载好存起来
```javascript

// @ts-ignore
import h337 from 'heatmap.js';

export class HeatMapLayer {
name: 'HeatMapLayer';
lastZoom: 0;
view: any;
box: any;
heatmap: any;
config: any;
visible: boolean;
data: any;
chart: any;
isShow: boolean = true;
map_DragStart_Listener: any
map_DragEnd_Listener: any;
map_ZoomStart_Listener: any;
map_ZoomEnd_Listener: any;
map_ExtentChange_Listener: any;
map_click_Listener: any;
constructor(view: any, config: any, data: any) {
this.init(view, config, data);
}
init(view: any, config: any, data: any) {
this.setBaseMap(view);
this.createDIV();
this.defaultConfig();
//更新配置
if (config) {
this.setConfig(config);
}
this.createLayer();
this.setData(data);
this.startMapEventListeners();
}
setBaseMap(view: any) {
this.view = view;
}
defaultConfig() {
this.config = {
container: this.box,
radius: 40,
debug: false,
visible: true,
useLocalMaximum: false,
gradient: {
0.45: 'rgb(000,000,255)',
0.55: 'rgb(000,255,255)',
0.65: 'rgb(000,255,000)',
0.95: 'rgb(255,255,000)',
1.0: 'rgb(255,000,000)'
}
};
//this.heatmap = heatmapFactory.create(this.config);
}
setConfig(config: any) {
this.config = {
container: this.box,
radius: config.radius,
maxOpacity: config.maxOpacity,
minOpacity: config.minOpacity,
debug: false,
visible: true,
useLocalMaximum: false,
gradient: config.gradient
};
if (!this.isShow) {
this.config.width = config.width;
this.config.height = config.height;
}
}
setData(points: any) {
// console.log(points,"iiiiiiiiiiiiiiiiiii");
this.data = JSON.parse(JSON.stringify(points));
// console.log( this.data,"000000000000000000");
}
setVisible(bool: any) {
if (!this.box || this.visible === bool) return;
this.box.hidden = !bool;
this.visible = bool;
// bool === true && setCharts();
}
refreshBegin() {
this.box.hidden = true;
}
refreshEnd() {
this.box.hidden = false;
}
on(eventName: any, handler: any, context: any) {
this.chart.on(eventName, handler, context);
}
off(eventName: any, handler: any, context: any) {
this.chart.off(eventName, handler, context);
}

• /*创建HeatMaplayer的容器，添加到map的layers下面*/
• createDIV() {
• this.box = document.createElement('div');
• this.box.setAttribute('id', 'testData');
• this.box.style.width = this.view.width + 'px';
• this.box.style.height = this.view.height + 'px';
• this.box.style.position = 'absolute';
• this.box.style.top = 0;
• this.box.style.left = 0;
• if (this.isShow) {
• const parent = document.getElementsByClassName('esri-view-surface')[0];
• parent.appendChild(this.box);
• }
• }
• /*创建HeatMaplayer的容器，添加到map的layers下面*/
• createLayer() {
• this.heatmap = h337.create(this.config);
• // heatMapLayer.heatmap = this.heatmap;
• }
• /*转换数据*/
• convertHeatmapData(data1: any) {
• const heatPluginData = {
• max: this.MaxValue(data1),
• data: new Array()
• };
•  
• if (data1[1].length == 2) {
• for (let i = 0; i < data1.length; i++) {
• const screenpoint = this.view.toScreen(

 更多参考https://xiaozhuanlan.com/topic/1708529463

标签：box,h337,data,js,arcgis,000,config,any,view
来源： https://www.cnblogs.com/haibalai/p/15827318.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。