tooltip & texture with scalable text

[MMSch]

Hi,

I'm a student at the SAE Institute Vienna and I'm currently working on the Major Project about Data Visualisazion with PhiloGL. It's a very nice Framework and the documentation and demos are very helpful to get in touch with WebGL.
In my project I have problems with the captions of the single lines and the Grid in the Background.

For the single lines (for each country) I tried to make a tooltip with the picking function but it was very imprecisely and only the information of the first layer (Süd-Amerika/ South America) were shown. Is it possible to use here the colorpicking function? I have understood the basic principle but I didn't know how to use it.
Is there an other possibility?

In case of the grey grid in the background I would like to label the lines. I also tried the tooltip here but the lines are behind the others. So I mapped a gif to a plane but the text gets pixelated. Is there any possibility to put scalable text on a plane or to render another canvas in 2d to a plane?

Here is the link to my project:
http://www.webcreatives.at/mp/

Thanks in advanced for helping

[Nicolas Garcia Belmonte]

Hi,

I didn't really understand the issue with picking, but I think that
following the technique in this example should work:

http://www.senchalabs.org/philogl/PhiloGL/examples/picking/

Simply set picking to true in the events configuration object, and for
each line you create with O3D.Model add the option:

pickable: true

I think this should be added here:

line = new PhiloGL.O3D.Model({
vertices: this.coordinates,
drawType: 'LINES',
colors: color,
program: 'fragment',
uniforms: {
shininess: 200,
reflection:1,
refraction:1
},
id: window.vars.data.Continent[i] + ':' + i

});

Then the events should work on the lines, no need to set picking
resolution or the pick method in any objects.

As for the background, maybe the fact that is a gif lowers the quality
of the image. Could you try using the text with in a png image?

I hope this helps,

--
Nicolas Garcia Belmonte - http://philogb.github.com/

[MMSch]

I implemented the picking function again but the problem is that it uses only the first line in front with the record 5:100. The other lines are in the background and then not pickable.

I also changed the background image to png. Now it's a lot better and only gets pixelated when I zoom. Is there any possibility to get text in every size, also when I zoom, readable?

Another question: Is there any possibility to update color after a model is created?

[Nicolas Garcia Belmonte]

Are you overlaying planes or using straight vertices connected with lines? In the first case the topmost plane will occlude the others, but if you're using lines then this should not happen. All visible lines should be pickable. If one line is occluded by another line though in that case the topmost line will only be pickable at that moment. Is that what's happening right now?

As for the image, unfortunately there is not a simple way to make resolution independent images in Webgl. I'll think on a workaround for that but it might need an external dom element to be in sync with the transform matrix you use for the zoom operation in Webgl.

[MMSch]

Yes, I think that happens at the moment. I made the lines with O3D.model and drawtype lines. How can I draw Lines otherwise?

My idea for the image is a 2d canvas that get rendered to the texture of the plane. I saw that a 3D scene can be rendered on a plane but there is again the problem with text. With a 2d canvas text can be used and scaling should also be possible. Would this be a solution?

And can i update the color of the line after it has been created?