WPF Canvas to animated gif with transparent background to display on svg canvas -

in web project, need dynamically render xaml frames animated gif. it's working - i'm rendering each frame png code:

        // save current canvas transform         var transform = surface.layouttransform;         // reset current transform (in case scaled or rotated)         surface.layouttransform = null;          // size of canvas         var size = new system.windows.size(surface.width, surface.height);         // measure , arrange surface         // important         surface.measure(size);         surface.arrange(new rect(size));          // create render bitmap , push surface         var renderbitmap =             new rendertargetbitmap(                 (int)size.width,                 (int)size.height,                 96d,                 96d,                 pixelformats.pbgra32);         renderbitmap.render(surface);          bitmap bmp;         // create file stream saving image         using (var stream = new memorystream()) {             // use png encoder our data             var encoder = new pngbitmapencoder();             // push rendered bitmap             encoder.frames.add(bitmapframe.create(renderbitmap));             // save data stream             encoder.save(stream);              bmp = new bitmap(stream);         }         return bmp; 

and creating animated gif magickimage. when i'm putting on web page (on svg canvas), background isn't transparent, black. how make transparent?

you have ensure have transparent flag set. have index of transparent colour , ensure set , ensure transparent pixels index transparent colour index (note transparent pixel can have rgb value).

i had @ magickimage documentation , gave me nothing on gif. looked @ code again , encoding png not gif. found gif info , maybe gave intermediate step. api not have gif can give details on gif data block can find correct flags , settings yourself.

the stuff have change in gce block before start of every image data block.

correct settings transparent

 options.delay = 2; //what ever want dont go under 2 many gif renderers limited 50frames second.  frame delay in 1/100 secs  options.transparentflag = true;  // must true transparent  options.transparentindex = transcolour; //the 8 bit index of transparent colour  // must set correctly transparent work.  options.dispose = 3; //use 3 or 2 if want transparency; 

writing gce block

// following writing gce block must included before every image // write writes array or single byte stream // shortdata creates  little-endian 16 bit short (high byte first) byte array // gce_id = 0xf9; // gce block indentifier gce_size = 4;  // block length  write([0x21 , gce_id , gce_size]); // extension introducer write(     0 +                             // bits 8:7 reserved     (options.dispose << 2) +        // bits 5:4:3:2 disposal method     (options.transparentflag?1:0)); // 1 transparency flag  write( shortdata(options.delay) ); // delay x 1/100 sec write( options.transparentindex ); // transparent color index write(0);                          // block terminator // image block follows 

not type of answer after don't think saving gifs. if should able find out set correct gce blocks written gif file. last note. use different colour index background colour use transparent index. reserve last 2 indexes of global rgb lookup table background , transparent.