Hi,
I am new to Cesium. Is there anywhere I can find some examples related to changing the texture of geometries with .svg or .png?
Diandian
Hi,
You can use an image to change the texture of geometries both in the JavaScript code and czml.
For the JavaScript an example I found from another forum post is:
var material = Cesium.Material.fromType(‘Image’);
material.uniforms.image = ‘Capture.gif’;
rectangle = new Cesium.RectanglePrimitive({
rectangle : Cesium.Rectangle.fromDegrees(-80.0, 20.0, -75.0, 25.0),
material: material
});
window.viewer.scene.primitives.add(rectangle);
``
Although that uses a .gif, you can substitute in .png and probably .svg too, I just haven’t personally tried that one.
Some good examples from other posts are here: https://groups.google.com/forum/#!searchin/cesium-dev/material$20image$20-czml/cesium-dev/GEoAj-GiUuQ/21194wTw4aMJ
You can ignore the questions for the most part, and just focus on how they add the an image to the materials.
If you are trying to do this from a CZML file you just add the appropriate sub-property names and input the uri of the image file with reference to the directory you’re running your Cesium application from. An example of this is:
[
{
“id”:“document”,
“name”:“simple”,
“version”:“1.0”,
“clock”:{
“interval”:“2014-09-08T10:00:00Z/2014-09-09T10:00:00Z”,
“currentTime”:“2014-09-08T10:00:00Z”,
“multiplier”:1,
“range”:“LOOP_STOP”,
“step”:“SYSTEM_CLOCK_MULTIPLIER”
}
},
{
“id”:“test”,
“availability”:“2014-09-08T10:00:00Z/2014-09-09T10:00:00Z”,
“polygon”:{
“show” : true,
“material”:{
“image”:{
“image” : “http://localhost:8080/Apps/MatLabTest/Images/satellite.png”
}
},
“fill” : true,
“perPositionHeight” : true,
“positions”:{
“cartesian” : [
2373800, 9665300, 8087700,
2573800, 9665300, 8087700,
2573800, 9465300, 8087700,
2373800, 9465300, 8087700
]
}
}
}
]
``
-Chris
Hi,
Thanks for your reply!
Actually, I know the first method you mentioned above, but that method seems only work for 2D geometries. My question is how to change the texture of a cylinder(3D) or other geometries(3D)?
Diandian