显示源代码
管线-流动材质
 开发文档
            <!DOCTYPE html>

<html>

<head>
    <meta charset='UTF-8' />
    <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
    <link href='http://ua.bigemap.com:30081/bmsdk/bigemap-gl.js/v1.1.0/Widgets/widgets.css' rel='stylesheet' />
    <script src='http://ua.bigemap.com:30081/bmsdk/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://ua.bigemap.com:30081/bmsdk/';
        var viewer = new bmgl.Viewer('container', { mapId: 'bigemap.dc-tian-w-satellite', requestRenderMode: false, });
        var lat = 30.598026044;
        var lon = 114.302312702;
        viewer.scene.globe.depthTestAgainstTerrain = true;
        //取消双击事件
        viewer.BMWidget.screenSpaceEventHandler.removeInputAction(bmgl.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
        //设置homebutton的位置
        bmgl.Camera.DEFAULT_VIEW_RECTANGLE =
            bmgl.Rectangle.fromDegrees(lon - 1, lat - 1, lon + 1, lat + 1);


        /*
          流纹纹理线
          color 颜色
          duration 持续时间 毫秒
       */
        function PolylineTrailLinkMaterialProperty(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(PolylineTrailLinkMaterialProperty.prototype, {
            isConstant: {
                get: function () {
                    return false;
                }
            },
            definitionChanged: {
                get: function () {
                    return this._definitionChanged;
                }
            },
            color: bmgl.createPropertyDescriptor('color')
        });
        PolylineTrailLinkMaterialProperty.prototype.getType = function (time) {
            return 'PolylineTrailLink';
        }
        PolylineTrailLinkMaterialProperty.prototype.getValue = function (time, result) {
            if (!bmgl.defined(result)) {
                result = {};
            }
            result.color = bmgl.Property.getValueOrClonedDefault(this._color, time, bmgl.Color.WHITE, result.color);
            result.image = bmgl.Material.PolylineTrailLinkImage;
            result.time = (((new Date()).getTime() - this._time) % this.duration) / this.duration;
            return result;
        }
        PolylineTrailLinkMaterialProperty.prototype.equals = function (other) {
            return this === other ||
                (other instanceof PolylineTrailLinkMaterialProperty &&
                    bmgl.Property.equals(this._color, other._color))
        }
        bmgl.PolylineTrailLinkMaterialProperty = PolylineTrailLinkMaterialProperty;
        bmgl.Material.PolylineTrailLinkType = 'PolylineTrailLink';
        bmgl.Material.PolylineTrailLinkImage = "/bmgl/images/ld4.png";

        bmgl.Material.PolylineTrailLinkSource = "czm_material czm_getMaterial(czm_materialInput materialInput)\n\
                                                {\n\
                                                    czm_material material = czm_getDefaultMaterial(materialInput);\n\
                                                    // vec2 st = materialInput.st;\n\
                                                    vec2 st = materialInput.st*repeat;\n\
                                                    vec4 colorImage = texture2D(image, vec2(fract(st.s - time), st.t));\n\
                                                    material.alpha = colorImage.a * color.a;\n\
                                                    material.diffuse = (colorImage.rgb+color.rgb)/2.0;\n\
                                                    return material;\n\
                                                }"
        bmgl.Material._materialCache.addMaterial(bmgl.Material.PolylineTrailLinkType, {
            fabric: {
                type: bmgl.Material.PolylineTrailLinkType,
                uniforms: {
                    color: new bmgl.Color(1.0, 0.0, 0.0, 0.5),
                    // X 可以动态调整图片需要重复的次数
                    repeat: { x: 5000, y: 2 },
                    image: bmgl.Material.PolylineTrailLinkImage,
                    time: 100,

                },
                source: bmgl.Material.PolylineTrailLinkSource
            },
            translucent: function (material) {
                return true;
            }
        });
        //10000 是材质的持续时间  可以调整看看效果
        var material = new bmgl.PolylineTrailLinkMaterialProperty(bmgl.Color.RED, 1000);


        function computeCircle(radius) {
            var positions = [];
            for (var i = 0; i < 360; i += 30) {
                var radians = bmgl.Math.toRadians(i);
                positions.push(
                    new bmgl.Cartesian2(
                        radius * Math.cos(radians),
                        radius * Math.sin(radians)
                    )
                );
            }
            return positions;
        }
        // var redTube = viewer.entities.add({
        //     polylineVolume: {
        //         positions: bmgl.Cartesian3.fromDegreesArray([
        //             -85.0,
        //             32.0,
        //             -85.0,
        //             36.0,
        //             -89.0,
        //             36.0,
        //             -91.0,
        //             30.0,
        //         ]),
        //         shape: computeCircle(3000.0),
        //         material: material,
        //     },
        // });
        var redTube = viewer.entities.add({
            polylineVolume: {
                positions: bmgl.Cartesian3.fromDegreesArray([
                    104.06061172485352, 30.691622364099512,
                    104.06056880950928, 30.688264036271132,
                    104.06374454498291, 30.688337846929571,
                    104.06383037567137, 30.697157814291458,
                    104.0710186958313, 30.69704710839882,
                    104.07076120376585, 30.688190225556248,
                    104.07631874084473, 30.686400298443729,
                    104.08073902130127, 30.684794871670618,
                    104.08696174621582, 30.694390128878513,
                    104.09258365631104, 30.691364035337518,
                    104.09039497375487, 30.688190225556248,
                    104.0875196456909, 30.689629524317517,
                    104.08533096313477, 30.686289580212929,
                    104.09106016159056, 30.683521583179978,
                    104.08915042877197, 30.680661236218103,
                    104.08354997634888, 30.68355849032903,
                    104.08108234405518, 30.679849251318913,
                    104.07537460327147, 30.682617353621485,
                    104.07385110855103, 30.679959976934466,
                    104.0744948387146, 30.679738525576433,
                    104.06885147094727, 30.671396821317973,
                    104.0681219100952, 30.671729026853139,
                    104.06837940216063, 30.673832968713747,
                    104.05807971954346, 30.678520534030415,
                    104.05829429626463, 30.656446389991498,
                    104.05305862426756, 30.649321049788398,
                    104.0469217300415, 30.646662757292184,
                    104.0435743331909, 30.646293544221333,
                    104.03872489929199, 30.64422592497429,
                    104.0386390686035, 30.657553908665772,
                    104.03816699981689, 30.669182088556568,
                    104.03803825378418, 30.676010684831887,
                    104.03868198394774, 30.678483624955902,
                    104.04168605804443, 30.68309714995188,
                    104.04374599456787, 30.685422283012443,
                    104.04983997344969, 30.68700924644352,
                    104.04889583587646, 30.690662853784424,
                    104.04820919036865, 30.695054380615961,
                    104.04404640197752, 30.70158594586032,
                    104.04074192047118, 30.705940077083433,
                    104.03610706329346, 30.712065047663003,
                    104.04031276702881, 30.712692281732235,
                    104.05112743377686, 30.713725364248265,
                    104.05262947082518, 30.714278796758435,
                    104.05584812164305, 30.716935228598953,
                    104.06370162963867, 30.707674294968463,
                    104.0639591217041, 30.696751892064274,
                    104.06044006347656, 30.69704710839882,
                    104.06061172485352, 30.691142610134154,
                ]),
                shape: computeCircle(100.0),
                material: material
            },
        });
        viewer.zoomTo(viewer.entities);
    </script>
</body>

</html>