如何在Cesium地图中更改EllipseOutlineGeometry的宽度？

Question

我正在关注沙堡椭圆轮廓几何.我想知道是否有任何方法可以使椭圆线宽更宽？有一些使用width属性使折线更宽的例子,但似乎没有办法制作一个ellipseOutlineGeometry对象.sandcastle示例在末尾有一个lineWidth设置,但是对此的更改似乎不会影响椭圆轮廓的宽度.

沙箱代码:

// Create the ellipse geometry.  To extrude, specify the
// height of the geometry with the extrudedHeight option.
// The numberOfVerticalLines option can be used to specify
// the number of lines connecting the top and bottom of the
// ellipse.
ellipseOutlineGeometry = new Cesium.EllipseOutlineGeometry({
    center : Cesium.Cartesian3.fromDegrees(-95.0, 35.0),
    semiMinorAxis : 200000.0,
    semiMajorAxis : 300000.0,
    extrudedHeight : 150000.0,
   rotation : Cesium.Math.toRadians(45),
   numberOfVerticalLines: 10
});
// Create a geometry instance using the ellipse geometry
// created above.
var extrudedEllipseOutlineInstance = new Cesium.GeometryInstance({
    geometry : ellipseOutlineGeometry,
    attributes : {
        color : Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.WHITE)
    }
});

// Add both ellipse outline instances to primitives.
 primitives.add(new Cesium.Primitive({
    geometryInstances : [ellipseOutlineInstance, extrudedEllipseOutlineInstance],
    appearance : new Cesium.PerInstanceColorAppearance({
        flat : true,
        renderState : {
            depthTest : {
                enabled : true
            },
             lineWidth : Math.min(2.0, scene.maximumAliasedLineWidth)  //changes here dont seem to affect the actual size?
        }
    })
}));

Answer 1

我假设你在Windows上(你会在一分钟内知道为什么).

关于为什么scene.maximumAliasedLineWidth总是返回1 的简单答案是因为这是您的Web浏览器允许的最大值.这也是当您使用大于1的值时出现错误的原因.当然,这个答案只会导致更多问题; 所以这里有更详细的回复.

WebGL规范声明实现支持最​​小线宽为1; 并且不需要支持大于1的行宽.实际上,所有OpenGL驱动程序都支持大于1的值; 我确信你目前使用的硬件也是如此.但是,Windows上的所有主要WebGL实现实际上都不使用OpenGL.

Chrome和Firefox都使用称为ANGLE(几乎是原生图形层引擎)的库,它通过DirectX在Windows上实现WebGL.ANGLE本身被认为是一致的实现.由于ANGLE选择仅支持1的线宽(我不会进入原因); 这意味着Chrome和Firefox都无法在Windows上绘制更多的线条(在此过程中驱使您和许多其他开发人员疯狂).

Internet Explorer 11采用了类似的方法,但它们不使用ANGLE,而是拥有自己的基于DirectX的自定义实现.更糟糕的是,虽然他们只声称支持线宽1; 浏览器本身总是绘制粗线(看起来在3-5像素宽之间).所以在IE中,不可能没有粗线.

在其他平台上实施; 无论是Android,iOS还是Mac OS,都没有这个问题.您的原始代码段将在这些平台上绘制厚度为2的行,在Windows上绘制1行.

一个方便的网站,用于了解您的浏览器正在使用的WebGL实现是http://webglreport.com/.它可以告诉您是否使用ANGLE,许多功能的最小值和最大值,以及无数其他信息(如果您是图形程序员,您可能只关心它).