const { Cartesian2, PostProcessStage, PostProcessStageComposite, PostProcessStageSampleMode } = Cesium;
|
export default {
|
/**
|
*
|
* 地图参数
|
*
|
*/
|
mapOption: {},
|
/**
|
*
|
* 初始化地图
|
*
|
*/
|
initMap() {
|
let option = {
|
url: SmartEarthRootUrl + "Workers/image/earth.jpg",
|
fullscreenButton: true,
|
contextOptions: {
|
failIfMajorPerformanceCaveat: false,
|
webgl: {
|
alpha: true,
|
preserveDrawingBuffer: true,
|
},
|
},
|
};
|
|
window.sgworld = new SmartEarth.SGWorld("sdkContainer", Cesium, option, null, function() {});
|
var dx = {
|
url: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
|
enablePickFeatures: false,
|
};
|
sgworld.Creator.createArcGisImageryLayer("ARCGIS", dx, "0", undefined, true, "");
|
|
window.Viewer = sgworld._Viewer;
|
Viewer.shadows = false;
|
//fps
|
Viewer.scene.debugShowFramesPerSecond = false;
|
},
|
/**
|
*
|
* 切换对象状态
|
*
|
*/
|
toggleObject(object) {},
|
/**
|
*
|
* 隐藏对象
|
*
|
*/
|
hideObject() {},
|
/**
|
*
|
* 显示对象
|
*
|
*/
|
showObject() {},
|
/**
|
*
|
* 创建WMS
|
*
|
*/
|
createWMS() {},
|
/**
|
*
|
* 创建WFS
|
*
|
*/
|
createWFS() {},
|
parseDefines(shader) {
|
let defines = [];
|
for (const key in shader.defines) {
|
if (shader.defines.hasOwnProperty(key)) {
|
const val = shader.defines[key];
|
defines.push("#define " + key + " " + val);
|
}
|
}
|
defines = defines.join("\n") + "\n";
|
if (shader.fragmentShader) {
|
shader.fragmentShader = defines + shader.fragmentShader;
|
}
|
if (shader.vertexShader) {
|
shader.vertexShader = defines + shader.vertexShader;
|
}
|
return shader;
|
},
|
kernelblur(name, sigma, radius, textureScale) {
|
let kernelFShader = `varying vec2 v_textureCoordinates;
|
uniform sampler2D colorTexture;
|
uniform vec2 colorTextureDimensions;
|
uniform vec2 direction;
|
|
float gaussianPdf(in float x, in float sigma) {
|
return 0.39894 * exp( -0.5 * x * x/( sigma * sigma))/sigma;
|
}
|
void main() {
|
|
vec2 invSize = 1.0 / colorTextureDimensions;
|
float fSigma = float(SIGMA);
|
float weightSum = gaussianPdf(0.0, fSigma);
|
vec3 diffuseSum = texture2D( colorTexture, v_textureCoordinates).rgb * weightSum;
|
for( int i = 1; i < KERNEL_RADIUS; i ++ ) {
|
float x = float(i);
|
float w = gaussianPdf(x, fSigma);
|
vec2 uvOffset = direction * invSize * x;
|
vec3 sample1 = texture2D( colorTexture, v_textureCoordinates + uvOffset).rgb;
|
vec3 sample2 = texture2D( colorTexture, v_textureCoordinates - uvOffset).rgb;
|
diffuseSum += (sample1 + sample2) * w;
|
weightSum += 2.0 * w;
|
}
|
gl_FragColor = vec4(diffuseSum/weightSum, 1.0);
|
}`;
|
|
let blurDirectionX = new Cartesian2(1.0, 0.0);
|
let blurDirectionY = new Cartesian2(0.0, 1.0);
|
|
let separableBlurShader = {
|
defines: {
|
KERNEL_RADIUS: radius,
|
SIGMA: sigma,
|
},
|
fragmentShader: kernelFShader,
|
};
|
this.parseDefines(separableBlurShader);
|
let blurX = new PostProcessStage({
|
name: name + "X",
|
textureScale: textureScale,
|
fragmentShader: separableBlurShader.fragmentShader,
|
forcePowerOfTwo: true,
|
uniforms: {
|
direction: blurDirectionX,
|
},
|
sampleMode: PostProcessStageSampleMode.LINEAR,
|
});
|
let blurY = new PostProcessStage({
|
name: name + "Y",
|
textureScale: textureScale,
|
fragmentShader: separableBlurShader.fragmentShader,
|
forcePowerOfTwo: true,
|
uniforms: {
|
direction: blurDirectionY,
|
},
|
sampleMode: PostProcessStageSampleMode.LINEAR,
|
});
|
let separableBlur = new PostProcessStageComposite({
|
name: name,
|
stages: [blurX, blurY],
|
inputPreviousStageTexture: true,
|
});
|
return separableBlur;
|
},
|
loadHighlight() {
|
let name = "light";
|
let fShader = `uniform sampler2D colorTexture;
|
uniform vec3 defaultColor;
|
uniform float defaultOpacity;
|
uniform float luminosityThreshold;
|
uniform float smoothWidth;
|
|
varying vec2 v_textureCoordinates;
|
void main() {
|
vec4 texel = texture2D(colorTexture, v_textureCoordinates);
|
|
#ifdef CZM_SELECTED_FEATURE
|
if(!czm_selected()) {
|
texel = vec4(0.);
|
}
|
#endif
|
|
vec3 luma = vec3(0.299, 0.587, 0.114);
|
float v = dot(texel.xyz, luma);
|
vec4 outputColor = vec4(defaultColor.rgb, defaultOpacity);
|
float alpha = smoothstep(luminosityThreshold, luminosityThreshold + smoothWidth, v);
|
gl_FragColor = mix(outputColor, texel, alpha);
|
}`;
|
|
let highlight = new PostProcessStage({
|
name: "highlight",
|
fragmentShader: fShader,
|
uniforms: {
|
defaultColor: [0.3, 0.3, 0.3],
|
luminosityThreshold: 0.6,
|
defaultOpacity: 0.1,
|
smoothWidth: 0.01,
|
},
|
});
|
|
const blurStage1 = this.kernelblur(name + "Blur1", 3, 3, 1.0);
|
const blurStage2 = this.kernelblur(name + "Blur2", 5, 5, 0.5);
|
const blurStage3 = this.kernelblur(name + "Blur3", 7, 7, 0.25);
|
const blurStage4 = this.kernelblur(name + "Blur4", 9, 9, 0.125);
|
const blurStage5 = this.kernelblur(name + "Blur5", 11, 11, 0.0625);
|
const blurCompositeStage = new PostProcessStageComposite({
|
name: name + "BlurComposite",
|
stages: [highlight, blurStage1, blurStage2, blurStage3, blurStage4, blurStage5],
|
inputPreviousStageTexture: true,
|
});
|
|
let blendFShader = `varying vec2 v_textureCoordinates;
|
uniform sampler2D blurTexture1;
|
uniform sampler2D blurTexture2;
|
uniform sampler2D blurTexture3;
|
uniform sampler2D blurTexture4;
|
uniform sampler2D blurTexture5;
|
uniform sampler2D colorTexture;
|
|
float lerpBloomFactor(const in float factor) {
|
float mirrorFactor = 1.2 - factor;
|
return mix(factor, mirrorFactor, 0.1);
|
}
|
|
void main() {
|
|
vec4 color = texture2D(colorTexture, v_textureCoordinates);
|
vec4 bloomTintColor = vec4(1.,1.,1.,1.);
|
vec4 bloomColor = 1. * (
|
lerpBloomFactor(1.0) * bloomTintColor * texture2D(blurTexture1, v_textureCoordinates) +
|
lerpBloomFactor(0.8) * bloomTintColor * texture2D(blurTexture2, v_textureCoordinates) +
|
lerpBloomFactor(0.6) * bloomTintColor * texture2D(blurTexture3, v_textureCoordinates) +
|
lerpBloomFactor(0.4) * bloomTintColor * texture2D(blurTexture4, v_textureCoordinates) +
|
lerpBloomFactor(0.2) * bloomTintColor * texture2D(blurTexture5, v_textureCoordinates)
|
);
|
|
gl_FragColor = bloomColor + color;
|
}`;
|
|
const addStage = new PostProcessStage({
|
name: name + "Additive",
|
uniforms: {
|
blurTexture1: blurStage1.name,
|
blurTexture2: blurStage2.name,
|
blurTexture3: blurStage3.name,
|
blurTexture4: blurStage4.name,
|
blurTexture5: blurStage5.name,
|
},
|
fragmentShader: blendFShader,
|
});
|
const compositeStage = new PostProcessStageComposite({
|
name: name + "Composite",
|
stages: [blurCompositeStage, addStage],
|
inputPreviousStageTexture: false,
|
});
|
return compositeStage;
|
},
|
/**
|
*
|
* 创建发光
|
*
|
*/
|
setLuminosity() {
|
return this.loadHighlight();
|
//window.sceneObj.highlight =
|
|
//sgworld._Viewer.scene.postProcessStages.add(compositeStage);
|
},
|
/**
|
*
|
* 创建热力图
|
*
|
*/
|
createHeatMap(response, attr, nameAttr) {
|
let that = this;
|
|
let features = response.data.features;
|
let heatmapData = [];
|
for (let i = 0; i < features.length; i++) {
|
let geom = features[i].geometry.coordinates;
|
let pre = features[i].properties;
|
//var position = { X: geom[0], Y: geom[1], Altitude: 100 };
|
let value = pre[attr] ? pre[attr] : 1;
|
value = Math.sqrt(value);
|
// value = 1;
|
heatmapData.push({
|
x: geom[0],
|
y: geom[1],
|
value: value,
|
});
|
}
|
let heatmapLayer = sgworld.Creator.addHeatMap("热力图1", {
|
type: "Heatmap3D", // 热力图类型
|
sourceData: heatmapData,
|
radius: 100,
|
minHeight: 0, // 底部高度
|
TIN_X: 300,
|
TIN_Y: 300,
|
colorScale: 1, //色值转换高度的比例
|
//showTIN: true, //显示三角网
|
//tooltip: true // tooltip显示数值
|
});
|
return heatmapLayer;
|
},
|
/**
|
*
|
* 创建地图柱状图
|
*
|
*/
|
createMapBar(response, attr, nameAttr) {
|
let features = response.data.features;
|
let entityData = [];
|
let groupId = sgworld.ProjectTree.createGroup("柱状图", true, 0);
|
var StartColor = "#0088ff";
|
var EndColor = "#a5dc00";
|
//获取填充颜色
|
var colorArr = sgworld.Core.gradientColor(StartColor, EndColor, 10);
|
var maxVal = -99999;
|
var minVal = 99999;
|
for (let i = 0; i < features.length; i++) {
|
let pre = features[i].properties;
|
let value = pre[attr] ? pre[attr] : 1;
|
if (value > maxVal) {
|
maxVal = value;
|
}
|
if (value < minVal) {
|
minVal = value;
|
}
|
}
|
|
for (let i = 0; i < features.length; i++) {
|
let geom = features[i].geometry.coordinates;
|
let pre = features[i].properties;
|
//var position = { X: geom[0], Y: geom[1], Altitude: 100 };
|
let value = pre[attr] ? pre[attr] : 1;
|
|
let labelVal = pre[attr] ? pre[attr] : 0;
|
if (labelVal > 500) {
|
let labelName = pre[nameAttr];
|
var num = Math.floor(((value - minVal) / (maxVal - minVal)) * 10);
|
var ysk = colorArr[num];
|
|
let scale = 0.3;
|
let Histogramwidth = 100;
|
|
var position = sgworld.Creator.CreatePosition(geom[0], geom[1], (value * scale) / 2, 1, 0, 0, 0, 300);
|
let cylinder = sgworld.Creator.CreateCylinder(position, Histogramwidth, value * scale, "", ysk, 100, groupId, "柱" + i);
|
|
//let label = sgworld.Creator.CreateLabel(position,value,"",{},groupId, "文本" + i);
|
let label = sgworld.Creator.addSimpleGraphic("label", {
|
position: Cesium.Cartesian3.fromDegrees(geom[0], geom[1], value * scale),
|
removeEdit: true,
|
text: labelName + "\n" + labelVal.toFixed(2) + " ",
|
heightReference: 0,
|
font: "42px 宋体",
|
outlineWidth: 2,
|
GroupID: groupId,
|
});
|
}
|
}
|
return groupId;
|
},
|
/**
|
*
|
* 创建模型
|
*
|
*/
|
createModel(url) {
|
window.sceneObj.tiltLowModel = sgworld.Creator.create3DTilesets(
|
"",
|
url,
|
{
|
skipLevelOfDetail: true,
|
preferLeaves: true,
|
},
|
{},
|
0,
|
true,
|
(data) => {
|
sgworld.Navigate.flyToObj(data);
|
}
|
);
|
},
|
/**
|
*
|
* 创建发光线
|
*
|
*/
|
createFlyLine() {},
|
/**
|
*
|
* 创建扫描
|
*
|
*/
|
createScanLight() {},
|
/**
|
*
|
* 创建圆形扫描
|
*
|
*/
|
createCircleLight() {},
|
};
|