Cesium各种数据的加载方式

自己留存备用

1. DEM地形数据

默认

viewer.terrainProvider = Cesium.createWorldTerrain()

自定义

var terrainProvider = new Cesium.CesiumTerrainProvider({
    url: dataServiceUrl + 'data/dem/'
});
viewer.terrainProvider = terrainProvider;

2. ArcGIS Server数据

var arcgisMap = new Cesium.ArcGisMapServerImageryProvider({
    url: arcgisUrl + '/MapServer/export',
    layers: 0,
});
var arcgisLayer = viewer.imageryLayers.addImageryProvider(arcgisMap);

3. 添加GeoJSON数据

function addPointLayer(layerName) {
    var geojson = Cesium.GeoJsonDataSource.load(
        'data/' + layerName + ".geojson", {
            clampToGround: true,
            markerSize: 0
        },
    );
    geojson.then(function(dataSource) {
        dataSource.name = layerName;
        viewer.dataSources.add(dataSource);
        for (var i = 0; i < dataSource.entities.values.length; i++) {
            entityList.push(dataSource.entities.values[i]);
            let entityProp = dataSource.entities.values[i].properties;
            let pointX = entityProp.X._value;
            let pointY = entityProp.Y._value;
            let labelText = entityProp.NAME._value;
            let type = entityProp.TYPE._value.toString();
            let typeid = entityProp.TYPEID._value.toString();
            var entityID = entityList.length - 1;
            //entity.billboard.disableDepthTestDistance = Number.POSITIVE_INFINITY; //去掉地形遮挡
            entityList[entityID].maximumHeights = 200000;
            entityList[entityID].name = type + '-' + typeid;
            //修改点要素光柱
            entityList[entityID].position = Cesium.Cartesian3.fromDegrees(pointX, pointY);
            entityList[entityID].label = {
                text: labelText,
                showBackground: true,
                scaleByDistance: new Cesium.NearFarScalar(10000, 1.0, 1.0e6, 0.2),
                horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
                verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
                disableDepthTestDistance: Number.POSITIVE_INFINITY
            };
            entityList[entityID].cylinder = {
                length: 100000.0,
                topRadius: 0,
                bottomRadius: 25000.0,
                material: Cesium.Color.YELLOW.withAlpha(0.8),
                outline: false,
                outlineColor: Cesium.Color.WHITE,
                outlineWidth: 1
            }
        }
    });
}

function addPolyLayer(layerName, flyto) {
    if (!Cesium.Entity.supportsPolylinesOnTerrain(viewer.scene)) {
        window.alert(
            "Polylines on terrain are not supported on this platform"
        );
    }
    var geojson = Cesium.GeoJsonDataSource.load(
        'data/' + layerName + ".geojson", {
            //clampToGround: true
        },
    );
    geojson.then(function(dataSource) {
        dataSource.name = layerName;
        viewer.dataSources.add(dataSource);
        for (var i = 0; i < dataSource.entities.values.length; i++) {
            entityList.push(dataSource.entities.values[i]);
            var entityID = entityList.length - 1;
            //entity.billboard.disableDepthTestDistance = Number.POSITIVE_INFINITY; //去掉地形遮挡
            entityList[entityID].polyline.width = 3;
            entityList[entityID].maximumHeights = 2000000;
            //修改线要素的颜色
            entityList[entityID].polyline.material = new Cesium.PolylineOutlineMaterialProperty({
                color: Cesium.Color.YELLOW,
                outline: false
            });
            entityList[entityID].polyline.heightReference = Cesium.HeightReference.CLAMP_TO_GROUND;
            /*entityList[entityID].polyline.depthFailMaterial = new Cesium.PolylineOutlineMaterialProperty({
                color: Cesium.Color.YELLOW,
                outline: false
            });*/
        }
    });
    if (flyto != undefined) {
        viewer.zoomTo(geojson);
    }
}

function getColorRamp(val) {
    if (val == null) {
        val = { 0.0: "blue", 0.1: "cyan", 0.37: "lime", 0.54: "yellow", 1: "red" }
    }
    var ramp = document.createElement('canvas');
    ramp.width = 100;
    ramp.height = 100;
    var ctx = ramp.getContext('2d');
    var grd = ctx.createRadialGradient(50, 50, 0, 50, 50, 80);
    for (var key in val) {
        grd.addColorStop(Number(key), val[key]);
    }
    ctx.fillStyle = grd;
    ctx.fillRect(0, 0, 100, 100);
    return ramp;
}

function addPolygonLayerByArray(layerName, isGradient) {
    var urlpath = "data/" + layerName + ".geojson";
    $.get(urlpath, function(data) {
        let josnN = JSON.parse(data);
        let features = josnN.features;
        let isread = josnN.isread;

        for (let i = 0; i < features.length; i++) {
            let degreeArray = [];
            let featureID, featureName, polyColor;
            if (isread) {
                featureID = features[i].properties.TYPE.toString() + '-' + features[i].properties.TYPEID.toString();
                featureName = features[i].properties.NAME;
                polyColor = features[i].properties.COLOR;
            } else {
                featureID = layerName;
                featureName = layerName;
                polyColor = features[i].properties.COLOR;
            }
            for (let j = 0; j < features[i].geometry.coordinates.length; j++) {
                let polygonArr = features[i].geometry.coordinates[j].toString().split(',');
                let rgba = new Cesium.Color(polyColor[0] / 255.0, polyColor[1] / 255.0, polyColor[2] / 255.0);
                for (let k = 0; k < polygonArr.length; k++) {
                    degreeArray[k] = parseFloat(polygonArr[k]);
                }
                if (isGradient) {
                    viewer.entities.add({
                        id: featureID,
                        name: featureID,
                        realname: featureName,
                        polygon: {
                            hierarchy: {
                                positions: Cesium.Cartesian3.fromDegreesArray(degreeArray)
                            },
                            material: new Cesium.ImageMaterialProperty({
                                transparent: true, //设置透明
                                image: getColorRamp({
                                    0.0: rgba.withAlpha(0.6).toCssColorString(),
                                    0.2: rgba.withAlpha(0.3).toCssColorString(),
                                    0.4: rgba.withAlpha(0.2).toCssColorString(),
                                    0.6: rgba.withAlpha(0.15).toCssColorString(),
                                    0.8: rgba.withAlpha(0.1).toCssColorString(),
                                    1.0: rgba.withAlpha(0.0).toCssColorString()
                                })
                            }),
                        },
                    });
                } else {
                    viewer.entities.add({
                        id: featureID,
                        name: featureID,
                        realname: featureName,
                        polygon: {
                            hierarchy: {
                                positions: Cesium.Cartesian3.fromDegreesArray(degreeArray)
                            },
                            material: new Cesium.Color(polyColor[0] / 255.0, polyColor[1] / 255.0, polyColor[2] / 255.0, polyColor[3]) //Cesium.Color.BLUE.withAlpha(0.5)
                        },
                    });
                }

            }
        }

    });
}

function addPolygonLayer(layerName, polyColor, flyto) {
    var geojson = Cesium.GeoJsonDataSource.load(
        'data/' + layerName + ".geojson", {
            clampToGround: false
        },
    );
    geojson.then(function(dataSource) {
        dataSource.name = layerName;
        viewer.dataSources.add(dataSource);
        for (var i = 0; i < dataSource.entities.values.length; i++) {
            entityList.push(dataSource.entities.values[i]);
            var entityID = entityList.length - 1;
            //entity.billboard.disableDepthTestDistance = Number.POSITIVE_INFINITY; //去掉地形遮挡
            entityList[entityID].maximumHeights = 20000000;
            //修改面要素的颜色
            entityList[entityID].polygon.height = 7000;
            entityList[entityID].polygon.outline = false;
            entityList[entityID].polygon.material = new Cesium.ImageMaterialProperty({
                color: new Cesium.Color(polyColor[0] / 255.0, polyColor[1] / 255.0, polyColor[2] / 255.0, polyColor[3])
            });
        }
    });
    if (flyto != undefined) {
        viewer.zoomTo(geojson);
    }
}