GUI glitch while adding multiple rectangles

Recommended Posts

19 minutes ago, Pryme8 said:

yes convert the texture to a uriBlob element then on your ui element pass the image url as "data:"+uriBlob

Alright then I'll try to do that

Share this post

Link to post
Share on other sites

I've got a question: will the uriblob be scalable?

Meaning, when the window is resized will the image also be resized but without any quality degradation.

Plus I've been googling around for a way to convert my dynamic texture to URI and the only thing I've found is this by Deltakosh:

I haven't a way yet to implement this code into mine, if its even possible

Share this post

Link to post
Share on other sites

I ended up using this in order to create a svg istead of using canvas:

        var svg = document.querySelector('svg');
        var w = map.cells[0].length, h = map.cells.length;
        svg.setAttribute('viewbox', '0 0 ' + w * guiGen.cellSize + ' ' + h * guiGen.cellSize);
        for (var y = 0; y < h; y++) {
            for (var x = 0; x < w; x++) {
                if (map.cells[y][x] === 1) {
                    var fill = 'fill:rgb(0,0,0);'
                else {
                    var fill = 'fill:rgb(255,255,255);'
                var svgns = "";
                var rectangle = document.createElementNS(svgns, 'rect');
                    x: x * guiGen.cellSize,
                    y: (h - y) * guiGen.cellSize,
                    width: guiGen.cellSize,
                    height: guiGen.cellSize,
                    style: fill


Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.