Combine primitive and specify different textures?

let instance1 = new Cesium.GeometryInstance({

geometry: new Cesium.RectangleGeometry({

rectangle: Cesium.Rectangle.fromDegrees(-40, -20, 50, 20)

})

});

let instance2 = new Cesium.GeometryInstance({

geometry: new Cesium.RectangleGeometry({

rectangle: Cesium.Rectangle.fromDegrees(-30, -10, 30, 10)

})

});

var material1 = Cesium.Material.fromType(‘Image’);

material1.uniforms.image = ‘images/1.jpg’;

material1.uniforms.repeat = new Cesium.Cartesian2(1.0, 1.0);

var material2 = Cesium.Material.fromType(‘Image’);

material2.uniforms.image = ‘images/2.jpg’;

material2.uniforms.repeat = new Cesium.Cartesian2(1.0, 1.0);

scene.primitives.add(new Cesium.Primitive({

                geometryInstances: [instance1, instance2]

}));

``

instance1 material------->material1

instance2 material------->material2

I need to merge two rectangles and then manipulate the primitive matrix after merging.

Hi again,

Take a look at the Geometry and Appearances tutorial section on Combining Geometry.

You can then set the modelMatrix property of the resulting primitive.

Thanks!

Gabby

aha,么么哒。

I’ve seen this document(https://cesiumjs.org/tutorials/Geometry-and-Appearances/#combining-geometries) before, but can only specify a different color, can’t specify a different picture。I need to set different pictures instead of colors.

var viewer = new Cesium.Viewer(‘cesiumContainer’);

var scene = viewer.scene;

var instance = new Cesium.GeometryInstance({

geometry : new Cesium.RectangleGeometry({

rectangle : Cesium.Rectangle.fromDegrees(-100.0, 20.0, -90.0, 30.0),

vertexFormat : Cesium.PerInstanceColorAppearance.VERTEX_FORMAT

}),

attributes : {

**color : 'image/1.jpg'//new Cesium.ColorGeometryInstanceAttribute(0.0, 0.0, 1.0, 0.8) I need to set different pictures instead of colors.**

}

});

var anotherInstance = new Cesium.GeometryInstance({

geometry : new Cesium.RectangleGeometry({

rectangle : Cesium.Rectangle.fromDegrees(-85.0, 20.0, -75.0, 30.0),

vertexFormat : Cesium.PerInstanceColorAppearance.VERTEX_FORMAT

}),

attributes : {

**color :'image/2.jpg'  //new Cesium.ColorGeometryInstanceAttribute(1.0, 0.0, 0.0, 0.8)**

}

});

scene.primitives.add(new Cesium.Primitive({

geometryInstances : [instance, anotherInstance],

appearance : new Cesium.PerInstanceColorAppearance()

}));

``

在 2018年7月3日星期二 UTC+8上午2:04:18,Gabby Getz写道:

You could create a new Appearance based on perInstanceColorAppearance, to instance the image/texture attribute rather than the color.

var material1 = Cesium.Material.fromType('Image');
material1.uniforms.image = 'images/1.jpg';
material1.uniforms.repeat = new Cesium.Cartesian2(1.0, 1.0);

var material2 = Cesium.Material.fromType('Image');
material2.uniforms.image = 'images/2.jpg';
material2.uniforms.repeat = new Cesium.Cartesian2(1.0, 1.0);

// Two rectangles in a primitive, each with a different color
var instance = new Cesium.GeometryInstance({
  geometry : new Cesium.RectangleGeometry({
    rectangle : Cesium.Rectangle.fromDegrees(0.0, 20.0, 10.0, 30.0),
    material: material1  //I know it's wrong to write this.
  }),
  attributes : {
    //color : new Cesium.Color(1.0, 0.0, 0.0, 0.5)
  }
});

var anotherInstance = new Cesium.GeometryInstance({
  geometry : new Cesium.RectangleGeometry({
    rectangle : Cesium.Rectangle.fromDegrees(0.0, 40.0, 10.0, 50.0),
    material: material2  //I know it's wrong to write this.
  }),
  attributes : {
    //color : new Cesium.Color(0.0, 0.0, 1.0, 0.5)
  }
});

var rectanglePrimitive = new Cesium.Primitive({
  geometryInstances : [instance, anotherInstance], //Combine  the two rectangles.
  appearance : new Cesium.PerInstanceColorAppearance()
});

I need to create two rectangles,each with a different image/texture  rather than the color., and then merge the two rectangles.So need to rewrite the "Perinstancecolorappearance" class?

在 2018年7月4日星期三 UTC+8上午5:12:36,Gabby Getz写道:

@Gabby Getz

在 2018年7月2日星期一 UTC+8下午1:58:58,xypi…@126.com写道:

help 55555555555

在 2018年7月4日星期三 UTC+8下午12:01:36,xypi…@126.com写道:

So it turns out this take a bit of non-trivial code to get it to work. What Gabby was suggesting was to create your own Appearance class, based off of PerInstanceColorAppearance. That way you could specify your own shader and pass the texture that way. The most straightforward approach I think would be to just put all the different images into one texture atlas, and have each instance draw the correct texture coordinates (this is how the Billboards class does it I believe).

So, the short answer is, it’s not currently supported by Cesium, but you’re welcome to make a feature request by making an issue on GitHub, and of course, contributions are always welcome! What you might need to do for now is either implement your own custom appearance so they all share the same big texture atlas, or to try having different instancing groups for each unique texture.

so , Can Defines two appearance, (A appearance and b appearance ), A appearance is the parent of B appearance, rotates A appearance matrix, B appearance follows A appearance rotation?

在 2018年7月7日星期六 UTC+8上午4:43:43,Omar Shehata写道:

View attachment picture,A appearance is a picture of a jellyfish,B appearance is a close button icon,A appearance and B appearance should be a whole,Move A appearance through A matrix on sphere, the position of B appearance following A appearance move
在 2018年7月7日星期六 UTC+8上午4:43:43,Omar Shehata写道:

I think you would have to manually keep track of them and move them both so that they would stay together.