Giter Club home page Giter Club logo

Comments (6)

antimatter15 avatar antimatter15 commented on August 21, 2024

No idea

from jsgif.

jonobr1 avatar jonobr1 commented on August 21, 2024

totally does. SO AWESOME!

sudo code:

var readBuffer = new Uint8Array(canvas.width * canvas.height * 4);
context.readPixels(0, 0, canvas.width, canvas.height, context.RGBA, context.UNSIGNED_BYTE, readBuffer);
encoder.addFrame(readBuffer, true);

I noticed the AS3 version is under MIT License. Is yours as well?

from jsgif.

antimatter15 avatar antimatter15 commented on August 21, 2024

Yeah

from jsgif.

deethee avatar deethee commented on August 21, 2024

for some reason, on webgl renderer method getcontext is always null.

The only method returning an image is canvas.toDataURL("image/png"); this seems not to be compatible with this function, or maybe anyone has an idea how?

from jsgif.

ranbuch avatar ranbuch commented on August 21, 2024

Hi @deethee,
This link should help you:
http://stackoverflow.com/questions/32556939/saving-canvas-to-image-via-canvas-todataurl-results-in-black-rectangle#answers

Also to get the context you can always hijack createElement and getContext methods and save the context:

        new function() {
                var orgCreateElement = document.createElement;
                // hijack createElement to hijack all the canvases getContext  
                Object.defineProperty(document, 'createElement', 
                {value: function(type) {
                    var ans = orgCreateElement.apply(this, Array.prototype.slice.call(arguments));
                    if (type == 'canvas') {
                        var orgGetContext = ans.getContext;
                        // hijack getContext to catch all the contexts and save then in window.mainContext (or wherever . . .) 
                        ans.getContext = function() {
                            if (!window.mainContext)
                                window.mainContext = [];
                            if (typeof arguments[1] === 'object')
                                // set preserveDrawingBuffer = true will help you with canvas.toDataURL("image/png"); method
                                arguments[1].preserveDrawingBuffer = true;
                            var c = orgGetContext.apply(this, Array.prototype.slice.call(arguments));
                            window.mainContext.push(c); 
                            return c;
                        };
                    }
                    return ans;
                }});
        }

That may be an overkill but just in case you're using some other framework (such as three.js) . . .
Make sure this code is running before any canvas has been created.
Your context is inside window.mainContext array.

Regarding @jonobr1 code unfortunately the browser always gets stuck in this line:

encoder.addFrame(readBuffer, true);

with very high CPU hz

from jsgif.

ranbuch avatar ranbuch commented on August 21, 2024

I've decided to go with that one:
https://github.com/yahoo/gifshot
while providing an images array with canvas.toDataURL("image/png") as images sources.

Works for me.

from jsgif.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.