Jump to content

Getting "RangeError: offset is out of bounds" exception when extract base64 data from container, when devicePixelRatio not equal to 1


Akila Bandara
 Share

Recommended Posts

Hi All,

I'm developing simple image editor which is need to load a image and add texts and drawings and save the edited image. But I'm getting this exception when try to use plugin.extract.base64 method for my container. This exception is getting only when device pixel ratio is not equal to one. (PIXI version: 4.8.1)

pixi.min.js:17 Uncaught RangeError: offset is out of bounds
    at Uint8ClampedArray.set (<anonymous>)
    at t.canvas (pixi.min.js:17)
    at t.base64 (pixi.min.js:17)

Here is my code sample.

PIXI.settings.RESOLUTION = window.devicePixelRatio;
PIXI.settings.ROUND_PIXELS = false;
		
var container = document.getElementById('editor-container');
this.set('pixiRenderer', PIXI.autoDetectRenderer(container.offsetWidth, container.offsetHeight, {transparent: true}));
container.appendChild(this.get('pixiRenderer').view);
		
this.set('stage', new PIXI.Container());
		
// Load image to pixi 
var texture = PIXI.Texture.fromImage(img);
var image = new PIXI.Sprite(texture);
this.get('stage').addChild(image);

// On save image
var base64 = this.get('pixiRenderer').plugins.extract.base64(this.get('stage'), 'image/jpeg', 1);

Note: If not update the PIXI.settings.RESOLUTION to device pixel ratio exception will not be created. But that is applied to keep keep clarity of image and drawings when zooming the web page.

If anyone can help it would be great.

Thanks.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...