Strange Behavior in drawing

Hello ,

I’m currently trying to construct coloring app that uses the predefined Graphics Api … the problem I’m facing is a strange behavior in the simulator and browser WebGL mode … while it’s working with a little bit of lag in the canvas mode in browser

this is the strange behavior

and here is the code written with the help of @PZsolt27 … Thank you very Much

if (this.gfxTarget !== null) {

this.gfxTarget.node.on(cc.Node.EventType.TOUCH_START, function (event) {
this.lastPos = event.touch.getLocation();
}, this);

this.gfxTarget.node.on(cc.Node.EventType.TOUCH_MOVE, function (event) {
var g = this.gfxTarget;

g.lineWidth = 20;
g.lineCap = cc.Graphics.LineCap.ROUND;
g.lineJoin = cc.Graphics.LineCap.ROUND; 
g.fillColor = this.currentColor;
g.strokeColor = this.currentColor;

var delta = event.touch.getDelta();

g.moveTo(this.lastPos.x, this.lastPos.y);
g.lineTo(this.lastPos.x + delta.x, this.lastPos.y + delta.y);
g.close();

g.stroke();
g.fill();                

this.lastPos = event.touch.getLocation(); }, this);  }

the problem actually recoloring the previous drawn line segments …

Hope someone can help

Thanks
Regards
Abulbisht

Take a look at this warning generated from my own test. Seems like it’s a cc.graphic limitation.

testDraw.zip (467.4 KB)

Stack Trace:

Too many graphics vertices generated, only 65536 vertices support.
cc.warnID @ CCDebugger.js:317
_render @ graphics-webgl-cmd.js:329
rendering @ graphics-webgl-cmd.js:370
rendering @ RendererWebGL.js:480
mainLoop @ CCDirector.js:1404
callback @ CCGame.js:568

Thank you @jake72 … I’ve searched about this and I’ve found this

which means that this drawback is from WebGl …

how can we avoid this to get this functionality running though ?

@slackmoehrle can you advice this guy here?

I have asked via internal chat for an engineer to look at this topic.

Any updates on this

There is not a very good way to solve this for now.
Maybe you can try to create a new graphics for drawing when too many vertices generate.