• Cesium中DrawCommand使用【转】


    Cesium中DrawCommand使用
    viewer.scene.primitives.add(object)方法在添加自定义的物体时,首先会加载object里的update方法,若没有则会报如下错误

     代码如下:

    //定义一个Trangles类
    function Trangles(options) {
    this._viewer = options.viewer
    this._modelMatrix = options.modelMatrix
    this.arr = options.arr
    }
    //用prototype给定方法和属性
    Trangles.prototype.getCommand = function(context) {
    //顶点着色器
    let v = `
    attribute vec3 position3DHigh;
    attribute vec3 position3DLow;
    void main()
    {
    vec4 p = czm_translateRelativeToEye(position3DHigh, position3DLow);
    p = czm_modelViewProjectionRelativeToEye * p;
    gl_Position = p;
    }
    `
    //片元着色器
    let f = `void main()
    {
    gl_FragColor = vec4(0,1,0,1);
    }
    `
    //shaderProgram将两个着色器合并
    var shaderProgram = Cesium.ShaderProgram.fromCache({
    context: context,
    vertexShaderSource: v,
    fragmentShaderSource: f
    })
    //渲染状态
    var renderState = Cesium.RenderState.fromCache({
    depthTest: {
    enabled: false
    },
    depthMask: false,
    blending: Cesium.BlendingState.ALPHA_BLEND
    })
    //索引数组Buffer
    var indexBuffer = Cesium.Buffer.createIndexBuffer({
    context: context,
    typedArray: new Uint32Array([0, 1, 2]), //索引顺序
    usage: Cesium.BufferUsage.STATIC_DRAW,
    indexDatatype: Cesium.IndexDatatype.UNSIGNED_INT
    })
    //顶点数组Buffer
    var vertexBuffer = Cesium.Buffer.createVertexBuffer({
    context: context,
    typedArray: Cesium.ComponentDatatype.createTypedArray(
    Cesium.ComponentDatatype.FLOAT,
    this.arr //顶点位置数组
    ),
    usage: Cesium.BufferUsage.STATIC_DRAW
    })
    //用来表示逐个顶点的信息
    var attributes = []
    attributes.push({
    index: 0,
    vertexBuffer: vertexBuffer,
    componentDatatype: Cesium.ComponentDatatype.FLOAT,
    componentsPerAttribute: 3,
    normalize: false
    })
    //顶点数组(设置顶点属性和索引Buffer)
    var vertexArray = new Cesium.VertexArray({
    context: context,
    attributes: attributes,
    indexBuffer: indexBuffer
    })

    //新建一个DrawCommand
    this.pointCommand = new Cesium.DrawCommand({
    primitiveType: Cesium.PrimitiveType.TRIANGLES,
    shaderProgram: shaderProgram,
    renderState: renderState,
    vertexArray: vertexArray,
    pass: Cesium.Pass.OPAQUE,
    modelMatrix: this._modelMatrix
    })
    }
    Trangles.prototype.destroy = function() {
    //this.arr = [];
    }
    Trangles.prototype.update = function(frameState) {
    if (this.pointCommand) {
    var commandList = frameState.commandList
    commandList.push(this.pointCommand)
    this._viewer.scene.requestRender()
    } else {
    this.getCommand(this._viewer.scene.context)
    }
    }
    //模型矩阵
    var position = Cesium.Cartesian3.fromDegrees(119, 40, 0)
    var heading = Cesium.Math.toRadians(0)
    var pitch = Cesium.Math.toRadians(0)
    var roll = Cesium.Math.toRadians(0)
    var headingPitchRoll = new Cesium.HeadingPitchRoll(heading, pitch, roll)

    var modelMatrix = Cesium.Transforms.headingPitchRollToFixedFrame(position, headingPitchRoll, Cesium.Ellipsoid.WGS84, Cesium.Transforms.eastNorthUpToFixedFrame, new Cesium.Matrix4())
    //顶点数组
    var arr = [0, 0, 0, 0, 100000, 0, 100000, 100000, 0]

    var temp = new Trangles({ viewer, modelMatrix, arr })
    viewer.scene.primitives.add(temp)

    ------------------------------------------------------------------------------------------------------

    原文链接:https://blog.csdn.net/sinat_41537539/article/details/106941041

  • 相关阅读:
    Cisco网络模拟器踩坑记录
    PAT甲级1009水题飘过
    PAT甲级1011水题飘过
    springmvc中项目启动直接调用方法
    Eclipse中Java文件图标由实心J变成空心J的问题
    mysql求时间差
    maven常用命令
    java单例模式(两种常用模式)
    mybatis一对多,多对一
    mybatis简介
  • 原文地址:https://www.cnblogs.com/mazhenyu/p/13223634.html
Copyright © 2020-2023  润新知