let drConfig = {
|
width: 1000,
|
height: 1000,
|
};
|
|
function createCanvas() {
|
var canvas = document.createElement("canvas");
|
canvas.width = drConfig.width;
|
canvas.height = drConfig.height;
|
return canvas;
|
}
|
function drawHeatMap(datas) {
|
|
let gradient = {
|
'.3': 'blue',
|
'.5': 'green',
|
'.7': 'yellow',
|
'.95': 'red'
|
}
|
let heatmapContainer = document.createElement('div');
|
heatmapContainer.setAttribute('style', 'width:' + drConfig.width + 'px;height:' + drConfig.height + 'px;display:none;');
|
document.body.appendChild(heatmapContainer);
|
|
let heatmapInstance = h337.create({
|
container: heatmapContainer,
|
// 最大透明度
|
maxOpacity: 0.8,
|
// 最小透明度
|
minOpacity: 0.1,
|
// 模糊系数，模糊系数越高，渐变就越平滑
|
blur: 0.85,
|
// 默认半径
|
radius: 7,
|
// 渐变
|
gradient: gradient
|
});
|
|
heatmapInstance.setData(datas);
|
signallingData.canvas.push(heatmapInstance._renderer.canvas);
|
signallingData.heatmap.push(heatmapContainer);
|
return heatmapInstance._renderer.canvas;
|
}
|
|
function pointToPixel(point) {
|
let result = {
|
x: 0, y: 0,
|
};
|
let dx = signallingData.extent.dx;
|
let dy = signallingData.extent.dy;
|
result.x = Math.floor((point[0] - signallingData.extent.minx) * drConfig.width / dx);
|
result.y = Math.floor((signallingData.extent.maxy - point[1]) * drConfig.height / dy);
|
return result;
|
}
|
function coordinateTransformation() {
|
let positions = signallingData.positions;
|
|
for (let i = 0; i < positions.length; i++) {
|
let position = positions[i];
|
let point = pointToPixel(position);
|
signallingData.pixels.push(point);
|
}
|
}
|
function createEntity() {
|
let pArray = [];
|
let extent = signallingData.extent;
|
pArray.push(extent.minx, extent.miny);
|
pArray.push(extent.maxx, extent.miny);
|
pArray.push(extent.maxx, extent.maxy);
|
pArray.push(extent.minx, extent.maxy);
|
let hierarchy = Cesium.Cartesian3.fromDegreesArray(pArray);
|
let entity = viewer.entities.add({
|
id: "signalling",
|
polygon: {
|
hierarchy: new Cesium.PolygonHierarchy(hierarchy),
|
material: new Cesium.ImageMaterialProperty({
|
image: new Cesium.CallbackProperty(function () {
|
return signallingData.canvas[signallingData.selectid];
|
}, false),
|
|
repeat: new Cesium.Cartesian2(1, 1)
|
})
|
}
|
});
|
return entity;
|
}
|
function dataDraw(callback) {
|
if (signallingData.heatmapEntity == null) {
|
coordinateTransformation();
|
let values = signallingData.values;
|
let points = signallingData.pixels;
|
for (let i = 0; i < values.length; i++) {
|
let value = values[i];
|
let datas = [];
|
let vmax = 0;
|
signallingData.count[i] = 0;
|
for (let j = 0; j < value.length; j++) {
|
let point = points[j];
|
if (value[j] != 0) {
|
signallingData.count[i] += value[j];
|
if (vmax < value[j]) {
|
vmax = value[j];
|
}
|
let data = {
|
x: point.x,
|
y: point.y,
|
value: value[j],
|
radius: 7
|
};
|
datas.push(data);
|
}
|
}
|
vmax = 500;
|
let canvas = drawHeatMap({
|
max: vmax,
|
min: 0,
|
data: datas
|
});
|
|
}
|
signallingData.heatmapEntity = createEntity();
|
if (callback) {
|
callback();
|
}
|
}else{
|
setDataRenderVisible(true);
|
}
|
return signallingData.heatmapEntity;
|
}
|
function setDataRenderVisible(show) {
|
try {
|
if (signallingData.heatmapEntity) {
|
signallingData.heatmapEntity.show = show;
|
}
|
} catch (e) { }
|
}
|
function removeDataRender() {
|
try {
|
//let entity = viewer.entities.getById("signalling");
|
viewer.entities.remove(signallingData.heatmapEntity);
|
signallingData.heatmapEntity = null;
|
|
} catch (e) { }
|
try {
|
for (let i = 0; i < signallingData.heatmap.length; i++) {
|
try {
|
document.body.removeChild(signallingData.heatmap[i]);
|
} catch (e) { }
|
}
|
signallingData.heatmap = [];
|
} catch (e) { }
|
}
|
