Coloring Canvas Drawing and Increasing Painting Area

Asked

Viewed 1,268 times

1

I have a type of entertainment on a page where I choose a drawing that is placed inside a canvas coloring.

I already have the brush and the colors. But I want something that does the function of the bucket that paints a whole area.

Click on the bucket, then click on a part of the drawing and paint the region that was clicked.

There’s a website that has this:

http://desportos.colorir.com/outros-desportos/judo-1.html

I tried to understand the source code, but I couldn’t find the function.

Does anyone have any idea how I can do it ? Just the beginning.

The plugin I’m using is this:

http://intridea.github.io/sketch.js/

javascript html canvas
  • 1

    Could you please post the code you have so far, or which JQUERY PLUGIN is using.

  • I edited the pole, Paulo Hard Disk.

  • Suggested research: Flood Fill

  • Hello. As already commented, it would be good for you to put the code you are doing so that someone can help where there is an error. The way the question is, you’re basically asking someone to do the code for you (and that’s not the focus of this site).

1 answer

1

The plugin you are using does not support what you want, it is still in version 0.0.1.

The most you can do is increase the brush’s action area. paint one of the drawing on the canvas with BUCKET requires a large amount of code.

Take a look at Google, there are several plugins that can help you better.

https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=Bucket%20paint%20jquery

This one looks pretty rich and still doesn’t have what you need.

http://www.jqueryscript.net/demo/jQuery-Plugin-for-Simple-Drawing-Surface-wPaint/

  • What I’ve been researching has to do with pixel manipulation. The site I put in my question has two files: painterGame.min.js and painterMobile.js. I tried to use them but it shows me a script error.

  • Could post what the error is?

  • Uncaught TypeError: Cannot set property 'className' of null

  • can send the line of code that gives the error?

  • btnPincel.className="",, in Chrome shows this.

  • tnPincel was not insticed. so the error.

Show 1 more comment

Browser other questions tagged javascript html canvas

You are not signed in. Login or sign up in order to post.