Draw line on canvas using Construct 3

Hi everyone,

I'd like to create a simple tutorial for a multiplayer drawing game, but it doesn't seem to be possible to do it on Construct 3?

I see there's a Canvas plugin available for Construct 2 (plugin-canvas_t64239), and a template project (https://www.scirra.com/store/royalty-fr ... -line-3445) that does exactly what I want.

Unfortunately, the Canvas plugin doesn't seem to be available for Construct 3. Is someone working on porting it? I wouldn't mind helping out porting that plugin.

Cheers!

(EDIT: I can't post URLs because I'm a new user here. Hope you understand what I mean.)

If you just need to draw lines and nothing else, you can do this without the canvas.

Use a Tiled Background object (say, 2x2 pixels), stretch it and rotate.

For example:

on first click - create TiledBackground at (mouse.x, mouse.y)

on second click - set TiledBackground width to distance (self.x, self.y, mouse.x, mouse.y),

set angle towards (mouse.x, mouse.y)

Thanks for the reply, dop2000, I actually need to draw the whole path of the mouse/touch from touch/click-start to touch/click-end.

You can create these tiled background objects on every tick - from previous mouse position to current mouse position.

Per dop's post:

+ System: On start of layout
-> TiledBackground: Destroy

| Global number x0? = 0
| Global number y0? = 0

+ Mouse: On Left button Clicked
-> System: Set x0 to Mouse.X
-> System: Set y0 to Mouse.Y

+ Mouse: Left button is down
+ System: x0 ? Mouse.X
+ System: y0 ? Mouse.Y
-> System: Create object TiledBackground on layer 0 at (x0, y0)
-> TiledBackground: Set width to distance(x0,y0,Mouse.X,Mouse.Y)
-> TiledBackground: Set angle toward (Mouse.X, Mouse.Y)
-> System: Set x0 to Mouse.X
-> System: Set y0 to Mouse.Y[/code:2c2a9beo]

It works best with thin lines. For thicker lines, add a rounded "end cap" sprite to each ssegment.

Thanks a lot, — I've created a simple multiplayer example using the method you described.

• Live demo:

  drawing-prototype.herokuapp.com/[/li]

Source code: github.com/endel/multiplayer-drawing-prototype[/li]