麻辣GIS微信平台

更多 GIS 干货

微信关注不错过

Cesium API - Cesium3DTileStyle 中文文档

本文介绍下Cesium中 Cesium3DTileStyle API的详细使用说明。

Cesium3DTileStyle API 调用方法

new Cesium.Cesium3DTileStyle(style)
应用于Cesium3DTileset的样式。

计算使用3D Tiles Styling language定义的表达式。

Name Type Description
style Resource | String | Object optional 样式的url或对象定义的样式。
示例:
tileset.style = new Cesium.Cesium3DTileStyle({
    color : {
        conditions : [
            ['${Height} >= 100', 'color("purple", 0.5)'],
            ['${Height} >= 50', 'color("red")'],
            ['true', 'color("blue")']
        ]
    },
    show : '${Height} > 0',
    meta : {
        description : '"Building id ${id} has height ${Height}."'
    }
});
tileset.style = new Cesium.Cesium3DTileStyle({
    color : 'vec4(${Temperature})',
    pointSize : '${Temperature} * 2.0'
});
参考:

成员变量

获取或设置用于计算样式的anchorLineColor属性的StyleExpression对象。也可以使用定义颜色样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Color.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写anchorLineColor表达式
style.anchorLineColor = 'color("blue")';
var style = new Cesium.Cesium3DTileStyle();
// 用条件重写anchorLineColor表达式
style.anchorLineColor = {
    conditions : [
        ['${height} > 2', 'color("cyan")'],
        ['true', 'color("blue")']
    ]
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的anchorLineEnabled属性的StyleExpression对象。也可以使用定义布尔值样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Boolean.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写anchorLineEnabled的表达式
style.anchorLineEnabled = 'true';
var style = new Cesium.Cesium3DTileStyle();
// 用条件重写anchorLineEnabled的表达式
style.anchorLineEnabled = {
    conditions : [
        ['${height} > 2', 'true'],
        ['true', 'false']
    ]
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的backgroundColor属性的StyleExpression对象。也可以使用定义颜色样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Color.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写backgroundColor表达式
style.backgroundColor = 'color("blue")';
var style = new Cesium.Cesium3DTileStyle();
// 用一个条件重写backgroundColor表达式
style.backgroundColor = {
    conditions : [
        ['${height} > 2', 'color("cyan")'],
        ['true', 'color("blue")']
    ]
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的backgroundEnabled属性的StyleExpression对象。也可以使用定义布尔值样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Boolean.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写backgroundEnabled表达式
style.backgroundEnabled = 'true';
var style = new Cesium.Cesium3DTileStyle();
// 用一个条件重写backgroundEnabled表达式
style.backgroundEnabled = {
    conditions : [
        ['${height} > 2', 'true'],
        ['true', 'false']
    ]
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的backgroundPadding属性的StyleExpression对象。也可以使用定义vec2样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Cartesian2.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写backgroundPadding表达式
style.backgroundPadding = 'vec2(5.0, 7.0)';
style.backgroundPadding.evaluate(feature); // returns a Cartesian2
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的color属性的StyleExpression对象。也可以使用定义颜色样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Color.

这个表达式适用于所有的瓦片格式。

示例:
var style = new Cesium3DTileStyle({
    color : '(${Temperature} > 90) ? color("red") : color("white")'
});
style.color.evaluateColor(feature, result); // returns a Cesium.Color object
var style = new Cesium.Cesium3DTileStyle();
// 用自定义函数重写颜色表达式
style.color = {
    evaluateColor : function(feature, result) {
        return Cesium.Color.clone(Cesium.Color.WHITE, result);
    }
};
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写颜色表达式
style.color = 'color("blue")';
var style = new Cesium.Cesium3DTileStyle();
// 用条件重写颜色表达式
style.color = {
    conditions : [
        ['${height} > 2', 'color("cyan")'],
        ['true', 'color("blue")']
    ]
};
获取或设置用于计算样式的disableDepthTestDistance属性的StyleExpression对象。也可以使用定义数值样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Number.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写disableDepthTestDistance表达式
style.disableDepthTestDistance = '1000.0';
style.disableDepthTestDistance.evaluate(feature); // returns a Number
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的distanceDisplayCondition属性的StyleExpression对象。也可以使用定义vec2样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Cartesian2.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写distanceDisplayCondition表达式
style.distanceDisplayCondition = 'vec2(0.0, 5.5e6)';
style.distanceDisplayCondition.evaluate(feature); // returns a Cartesian2
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的font属性的StyleExpression对象。也可以使用定义字符串样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回String.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium3DTileStyle({
    font : '(${Temperature} > 90) ? "30px Helvetica" : "24px Helvetica"'
});
style.font.evaluate(feature); // returns a String
var style = new Cesium.Cesium3DTileStyle();
// 用自定义函数重写字体表达式
style.font = {
    evaluate : function(feature) {
        return '24px Helvetica';
    }
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的heightOffset属性的StyleExpression对象。也可以使用定义数值样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Number.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用一个字符串重写toffset表达式
style.heightOffset = '2.0';
var style = new Cesium.Cesium3DTileStyle();
// 用一个条件重写toffset表达式
style.heightOffset = {
    conditions : [
        ['${height} > 2', '4.0'],
        ['true', '2.0']
    ]
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的horizontalOrigin属性的StyleExpression对象。也可以使用定义数值样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回HorizontalOrigin.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium3DTileStyle({
    horizontalOrigin : HorizontalOrigin.LEFT
});
style.horizontalOrigin.evaluate(feature); // returns a HorizontalOrigin
var style = new Cesium.Cesium3DTileStyle();
// 使用自定义函数重写horizontalOrigin表达式
style.horizontalOrigin = {
    evaluate : function(feature) {
        return HorizontalOrigin.CENTER;
    }
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的image属性的StyleExpression对象。也可以使用定义字符串样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回String.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium3DTileStyle({
    image : '(${Temperature} > 90) ? "/url/to/image1" : "/url/to/image2"'
});
style.image.evaluate(feature); // returns a String
var style = new Cesium.Cesium3DTileStyle();
// 使用自定义函数重写图像表达式
style.image = {
    evaluate : function(feature) {
        return '/url/to/image';
    }
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的labelColor属性的StyleExpression对象。也可以使用定义颜色样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Color.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写labelColor表达式
style.labelColor = 'color("blue")';
var style = new Cesium.Cesium3DTileStyle();
// 用条件重写labelColor表达式
style.labelColor = {
    conditions : [
        ['${height} > 2', 'color("cyan")'],
        ['true', 'color("blue")']
    ]
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的labelHorizontalOrigin属性的StyleExpression对象。也可以使用定义数值样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回HorizontalOrigin.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium3DTileStyle({
    labelHorizontalOrigin : HorizontalOrigin.LEFT
});
style.labelHorizontalOrigin.evaluate(feature); // returns a HorizontalOrigin
var style = new Cesium.Cesium3DTileStyle();
// 使用自定义函数重写labelHorizontalOrigin表达式
style.labelHorizontalOrigin = {
    evaluate : function(feature) {
        return HorizontalOrigin.CENTER;
    }
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的labelOutlineColor属性的StyleExpression对象。也可以使用定义颜色样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Color.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写labelOutlineColor表达式
style.labelOutlineColor = 'color("blue")';
var style = new Cesium.Cesium3DTileStyle();
// 用条件重写labelOutlineColor表达式
style.labelOutlineColor = {
    conditions : [
        ['${height} > 2', 'color("cyan")'],
        ['true', 'color("blue")']
    ]
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的labelOutlineWidth属性的StyleExpression对象。也可以使用定义数值样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Number.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写labelOutlineWidth表达式
style.labelOutlineWidth = '5';
var style = new Cesium.Cesium3DTileStyle();
// 用条件重写labelOutlineWidth表达式
style.labelOutlineWidth = {
    conditions : [
        ['${height} > 2', '5'],
        ['true', '0']
    ]
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的label style属性的StyleExpression对象。也可以使用定义数值样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回LabelStyle.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium3DTileStyle({
    labelStyle : '(${Temperature} > 90) ? ' + LabelStyle.FILL_AND_OUTLINE + ' : ' + LabelStyle.FILL
});
style.labelStyle.evaluate(feature); // returns a LabelStyle
var style = new Cesium.Cesium3DTileStyle();
// 用自定义函数重写labelStyle表达式
style.labelStyle = {
    evaluate : function(feature) {
        return LabelStyle.FILL;
    }
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的labelText属性的StyleExpression对象。也可以使用定义字符串样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回String.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium3DTileStyle({
    labelText : '(${Temperature} > 90) ? ">90" : "<=90"'
});
style.labelText.evaluate(feature); // returns a String
var style = new Cesium.Cesium3DTileStyle();
// 用自定义函数重写labelText表达式
style.labelText = {
    evaluate : function(feature) {
        return 'Example label text';
    }
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的labelVerticalOrigin属性的StyleExpression对象。也可以使用定义数值样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回VerticalOrigin.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium3DTileStyle({
    labelVerticalOrigin : VerticalOrigin.TOP
});
style.labelVerticalOrigin.evaluate(feature); // returns a VerticalOrigin
var style = new Cesium.Cesium3DTileStyle();
// 用自定义函数重写labelVerticalOrigin表达式
style.labelVerticalOrigin = {
    evaluate : function(feature) {
        return VerticalOrigin.CENTER;
    }
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置包含可被显式计算的应用程序特定表达式的对象,例如用于在UI中显示的对象。
示例:
var style = new Cesium3DTileStyle({
    meta : {
        description : '"Building id ${id} has height ${Height}."'
    }
});
style.meta.description.evaluate(feature); // 返回一个带有替换变量的字符串
获取或设置用于计算样式的pointOutlineColor属性的StyleExpression对象。也可以使用定义颜色样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Color.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写pointOutlineColor表达式
style.pointOutlineColor = 'color("blue")';
var style = new Cesium.Cesium3DTileStyle();
// 用条件重写pointOutlineColor表达式
style.pointOutlineColor = {
    conditions : [
        ['${height} > 2', 'color("cyan")'],
        ['true', 'color("blue")']
    ]
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的pointOutlineWidth属性的StyleExpression对象。也可以使用定义数字样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Number.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写pointOutlineWidth表达式
style.pointOutlineWidth = '5';
var style = new Cesium.Cesium3DTileStyle();
// 用条件重写pointOutlineWidth表达式
style.pointOutlineWidth = {
    conditions : [
        ['${height} > 2', '5'],
        ['true', '0']
    ]
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的pointSize属性的StyleExpression对象。也可以使用定义点大小样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Number.

此表达式仅适用于矢量瓦片或点云瓦片中的点要素。

示例:
var style = new Cesium3DTileStyle({
    pointSize : '(${Temperature} > 90) ? 2.0 : 1.0'
});
style.pointSize.evaluate(feature); // returns a Number
var style = new Cesium.Cesium3DTileStyle();
// 用自定义函数重写pointSize表达式
style.pointSize = {
    evaluate : function(feature) {
        return 1.0;
    }
};
var style = new Cesium.Cesium3DTileStyle();
// 用数值函数重写pointSize表达式
style.pointSize = 1.0;
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写pointSize表达式
style.pointSize = '${height} / 10';
var style = new Cesium.Cesium3DTileStyle();
// 用条件重写pointSize表达式
style.pointSize =  {
    conditions : [
        ['${height} > 2', '1.0'],
        ['true', '2.0']
    ]
};
readonlyready : Boolean
true时,样式已经就绪,可以对其表达式求值。 当使用对象(而不是url)构造样式时,立即执行true
Default Value: false
readonlyreadyPromise : Promise.<Cesium3DTileStyle>
获取将在样式就绪并可以计算其表达式时解析的约定(promise)。
获取或设置用于计算样式的scaleByDistance属性的StyleExpression对象。也可以使用定义vec4样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Cartesian4.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写scaleByDistance表达式
style.scaleByDistance = 'vec4(1.5e2, 2.0, 1.5e7, 0.5)';
style.scaleByDistance.evaluate(feature); // returns a Cartesian4
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的show属性的StyleExpression对象。也可以使用定义show样式的布尔、字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回或转换为Boolean

这个表达式适用于所有的瓦片格式。

示例:
var style = new Cesium3DTileStyle({
    show : '(regExp("^Chest").test(${County})) && (${YearBuilt} >= 1970)'
});
style.show.evaluate(feature); // 根据要素属性返回true或false。
var style = new Cesium.Cesium3DTileStyle();
// 用自定义函数重写show表达式
style.show = {
    evaluate : function(feature) {
        return true;
    }
};
var style = new Cesium.Cesium3DTileStyle();
// 用布尔值重写show表达式
style.show = true;
};
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写show表达式
style.show = '${Height} > 0';
};
var style = new Cesium.Cesium3DTileStyle();
// 重写带有条件的show表达式
style.show = {
    conditions: [
        ['${height} > 2', 'false'],
        ['true', 'true']
    ];
};
readonlystyle : Object
获取使用3D Tiles Styling language定义样式的对象。
Default Value: {}
获取或设置用于计算样式的translucencyByDistance属性的StyleExpression对象。也可以使用定义vec4样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回Cartesian4.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium.Cesium3DTileStyle();
// 用字符串重写translucencyByDistance表达式
style.translucencyByDistance = 'vec4(1.5e2, 1.0, 1.5e7, 0.2)';
style.translucencyByDistance.evaluate(feature); // returns a Cartesian4
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

获取或设置用于计算样式的verticalOrigin属性的StyleExpression对象。也可以使用定义数值样式的字符串或对象。 getter将返回内部的ExpressionConditionsExpression,这可能与提供给setter的值不同。

表达式必须返回VerticalOrigin.

此表达式仅适用于矢量瓦片中的点要素。

示例:
var style = new Cesium3DTileStyle({
    verticalOrigin : VerticalOrigin.TOP
});
style.verticalOrigin.evaluate(feature); // returns a VerticalOrigin
var style = new Cesium.Cesium3DTileStyle();
// 使用自定义函数重写verticalOrigin表达式
style.verticalOrigin = {
    evaluate : function(feature) {
        return VerticalOrigin.CENTER;
    }
};
实验功能说明:

这个功能是使用的3D Tiles规范的一部分,不是最终的,并可能会改变没有Cesium的标准弃用政策。

其他API

Cesium中文API文档手册(v1.63.1版本)参考:《Cesium中文API文档手册(v1.63.1版本)

相关阅读

麻辣GIS-Sailor

作者:

GIS爱好者,学GIS,更爱玩GIS。

声明

1.本文所分享的所有需要用户下载使用的内容(包括但不限于软件、数据、图片)来自于网络或者麻辣GIS粉丝自行分享,版权归该下载资源的合法拥有者所有,如有侵权请第一时间联系本站删除。

2.下载内容仅限个人学习使用,请切勿用作商用等其他用途,否则后果自负。

手机阅读
公众号关注
知识星球
手机阅读
麻辣GIS微信公众号关注
最新GIS干货
关注麻辣GIS知识星球
私享圈子

留言板(小编看到第一时间回复)