Coloring Made Even Easier

Announcements
,
1

We have added the following two Bitmap methods:

addBitmapData() - returns a Bitmap with BitmapData added
color() - does a floodFill but saves a half dozen complicated lines

const assets = "ai_coloring_groovy.png";
const path = "https://zimjs.org/assets/"; // fix the URL!
new Frame(FIT, 1481, 745, light, dark, ready, assets, path);
function ready() {
    const pic = new Pic("ai_coloring_groovy.png");
    const bitmap = new Bitmap(pic)
        .addBitmapData() // new - returns a new Bitmap with a bitmapData property
        .scaleTo()
        .cur()
        .center();	
    const color = series(red, orange, blue, green, yellow);
    bitmap.on("mousedown", ()=>{
        bitmap.color(color); // or get from ColorPicker()
        S.update();
    });		
}
1 Like
2

cool, any idea how to make a matching game.. so it need to be the exact color of the original drawing..

thanks to make an easy method to color with floodfill but it isn't yet a matching color game ofcource // so with a legend for example
so your example idea , but the button does not update the tile correctly, it comes black,

  • has it to do with the cache?

so from your zapp

I added a button met rotate button

image
image1681×667 92.8 KB

but each time I click the button I see black items

  • how can I fix it? thanks to help

so here my zapp

thanks to maybe add a button to refresh also in the original example
greetz
karel

3

That would be time for you to do the work. Not us. Carry on Karel.

4

I tried with updateCache() but seems not to work.. what do I wrong to get a new tile caching?

5

Make sure to refresh the browser cache.

6

that isn't the issue .. any idea how to reload a tile or blackwhite bitmapimage to be able to color the white again?

7

Sorry Karel - I was telling others to make sure to refresh to see the new 017.

for you, DM me - I don't want to debug on an announcement.