X3M, I will be waiting. BabylonJS looks pretty amazing.
The fix did not work out of the box, but was promising. Before I could tweak around and make it work, I ended up changing the library to Raphael, as it has path binary operations and I needed those.
But the issue is still there.
I am using the code, in instanceProto.onCreate = function()
this.divSVG = document.createElement('svg');
this.divSVG.setAttribute("id","divSVG");
this.divSVG.style.width = 100 + "%";
this.divSVG.style.height = 100 + "%";
this.divSVG.style.left = 0 + "px";
this.divSVG.style.top = 0 + "px";
this.divSVG.background = "red";
this.divSVG.setAttribute("position","relative");
var viewBox = "0 0 "+ this.width+ " " + this.height;
this.divSVG.setAttribute("viewBox",viewBox);
var maindiv = this.runtime.canvas.parentNode;
jQuery("body").append(this.divSVG);
..
The plugin is a 'world' plugin.
It starts at 10,10 and is 100, 120 in size.
But when I look at the created element in chrome debugger, it is not created ON the plugin object. It is at the bottom of the layout again. If I play with the coordinates the drawing are coming on top of the layout, so this is not because C2 canvas overdrawing the new one. So, few questions here, someone kindly help.
1) Can I add svg element (new one I am creating) on top of canvas (c2Canvas) element? I looked around in net and cold not see if this is ok. I checked other svg plugins (By pode) and it's adding a new element similar to c2Canvas, outside it. Any reason?
2) How do I create a div and fill colour exactly on top of the physical bounds of a plugin? I tried using the bbox and the quad properties and it seems that they all gives 0s for all the values in onCreate. When I console.log(this) for the plugin, I see bbox has left, top etc. values, but when I try to log (this.bbox) it gives all zeros. Also, when I use these values to set the values for the new div, it is setting all zeroes.