<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'/>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no'/>
<link rel='stylesheet'/>
<script src='http://bigemap.com:9000/bigemap-gl.js/v1.1.0/bigemap-gl.js'></script>
<style>
body {
margin: 0;
padding: 0;
}
#container {
position: absolute;
top: 0;
bottom: 0;
width: 100%;
}
.bmgl-widget-credits{display:none}
</style>
<title>part_test</title>
</head>
<body>
<div id='container'></div>
<script>
bmgl.Config.HTTP_URL = 'http://bigemap.com:9000';
var viewer = new bmgl.Viewer('container', {terrainId: 'bigemap.9af15d8e',mapId:'bigemap.zhongkexingtu', terrainExaggeration: 5,requestRenderMode:false});
viewer.scene.globe.depthTestAgainstTerrain=false;
/*
流動紋理線
color 顏色
duration 持續時間 毫秒
*/
function EllipsoidFadeMaterialProperty(color, duration) {
this._definitionChanged = new bmgl.Event();
this._color = undefined;
this._colorSubscription = undefined;
this.color = color;
this.duration = duration;
this._time = (new Date()).getTime();
}
bmgl.defineProperties(EllipsoidFadeMaterialProperty.prototype, {
isConstant: {
get: function () {
return false;
}
},
definitionChanged: {
get: function () {
return this._definitionChanged;
}
},
color: bmgl.createPropertyDescriptor('color')
});
EllipsoidFadeMaterialProperty.prototype.getType = function (time) {
return 'EllipsoidFade';
}
EllipsoidFadeMaterialProperty.prototype.getValue = function (time, result) {
if (!bmgl.defined(result)) {
result = {};
}
result.color = bmgl.Property.getValueOrClonedDefault(this._color, time, bmgl.Color.WHITE, result.color);
result.time = (((new Date()).getTime() - this._time) % this.duration) / this.duration;
return result;
}
EllipsoidFadeMaterialProperty.prototype.equals = function (other) {
return this === other ||
(other instanceof EllipsoidFadeMaterialProperty &&
bmgl.Property.equals(this._color, other._color))
}
bmgl.EllipsoidFadeMaterialProperty = EllipsoidFadeMaterialProperty;
bmgl.Material.EllipsoidFadeType = 'EllipsoidFade';
bmgl.Material.EllipsoidFadeSource =
"czm_material czm_getMaterial(czm_materialInput materialInput)\n" +
"{\n" +
"czm_material material = czm_getDefaultMaterial(materialInput);\n" +
"material.diffuse = 1.5 * color.rgb;\n" +
"vec2 st = materialInput.st;\n" +
"float dis = distance(st, vec2(0.5, 0.5));\n" +
"float per = fract(time);\n" +
"if(dis > per * 0.5){\n" +
"material.alpha = 0.0;\n"+
"discard;\n" +
"}else {\n" +
"material.alpha = color.a * dis / per / 1.0;\n" +
"}\n" +
"return material;\n" +
"}";
bmgl.Material._materialCache.addMaterial(bmgl.Material.EllipsoidFadeType, {
fabric: {
type: bmgl.Material.EllipsoidFadeType,
uniforms: {
color: new bmgl.Color(1.0, 0.0, 0.0, 1),
time: 0
},
source: bmgl.Material.EllipsoidFadeSource
},
translucent: function (material) {
return true;
}
});
viewer.entities.add({
name: 'EllipsoidFade',
position: bmgl.Cartesian3.fromDegrees(104.0, 30.0, 100.0),
ellipse: {
height: 0,
semiMinorAxis: 30000.0,
semiMajorAxis: 30000.0,
material: new bmgl.EllipsoidFadeMaterialProperty(bmgl.Color.BLUE, 2000)
}
});
viewer.zoomTo(viewer.entities);
</script>
</body>
</html>
源碼