Custom drawing

CesiumJS
1

I want to draw custom stuff using my own webgl code and shaders.

Got into the CesiumWidget.prototype.render method and add a call to my function, so i will fit in.

I want to draw a simple point. in the shader simply multiply it by the modelViewProjection matrix uniform, and set the pointSize to 50.

My questions are:
1. Which values should i give my point ?
2. Where can i get the mvp matrix ?

I've tried this:

a. Setting the mvp matrix uniform to
viewer.scene._context._us.modelViewProjection

b. And got my point values from the method viewer.scene.globe.ellipsoid.cartographicToCartesian(...)

And simply multiply them in the vertex shader

c. Canceled the depth test.

But the result is: When i roll and play with the globe, sometimes I see my point in the middle of the screen, and sometimes not..

is there a simple way to do it ? or should i copy all the complicated shaders and manipulate them to my needs?

2

It all depends on exactly you want to do. If you’re really looking to use webGL calls directly without going through the Cesium renderer at all, I’m not sure what the feasibility of that would be and what type of problems you will run into. Pat or Dan could chime in with thoughts on the subject.

If you are just looking to shade existing geometry, creating a custom material is the way to go and is fairly straight forward: see http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Materials.html&label=Showcases and https://gist.github.com/mramato/cbeede0339a067d3cf26 for some examples. That lets you use your own shaders.

If you want to create a custom geometry and then shade it yourself with custom shaders. Geometry & Appearances would be the correct way to do this:

Part 1 : http://cesiumjs.org/2013/11/04/Geometry-and-Appearances/

Part 2 : (never released/finished) https://github.com/AnalyticalGraphicsInc/cesium/wiki/Geometry-and-Appearances

Both blogs might be slightly out of date, I haven’t looked at them in a while; but the fundamentals haven’t changed. Also, the pointGeoemtry branch in GitHub, while unfinished, has a fairly simple diff that illustrates adding custom geometry/shader: https://github.com/AnalyticalGraphicsInc/cesium/compare/pointgeometry

If you can provide some more details about what you’re trying to do, I’m sure we could provide better info.

3

First of all, Thanks for the reply.

I will try to detail more what i'm trying to do.

I've developed a 2D GIS infrastructure over all engines. esri, google, ... - wrapper must be developed for each of course. My infrastructure is currently working in two modes webgl and/or 2d.

My code is very efficient so i will be able to provide allot of 'objects' on the map, such as billboards symbols (images/texts with images/texts around), and geometries.. The WebGL code is very cored with `lightgl`. very light shaders and data structures. Checked my infra with more than 100K objects, some are updating - works well. Those are the needs of my clients. and lately they asked for 3D support. So I found Cesium.

Tried to add 100K billboards to cesium and it's kind of stuck.. I checked the amount of buffers being added for billboard or any other primitive, and I saw allot of data and very complex shaders (compares to mine). I guess everything is needed for making all the nice things cesium provides. but in my case i don't need them (for now :slight_smile: ).

I guess i will have to adjust my shaders in order see my objects on the globe. but i'm looking for the minimal code and minimal data to upload and update.

Hope there is a solution. Because I can see us working very well together, using both of our strength and pushing both of us up.

Thanks,
Raz