John Forge

Define SVG rasterization size

Recommended Posts

Hi!

I am loading SVG images in my application. The SVGs don't have a width and height defined in the file, but the viewbox. Loading them basically works with Pixi.js.
But my problem is, that those SVG images are rasterized to an image default of 150x150px - in Chrome. In Safari on MacOS they are rasterized MUCH bigger. 
Is there any option, to tell the Texture Loader to use a given size? This would prevent above behaviour AND give the user the option, to define the size before rasterizing the image.
I wouldn't want to set width and height in the SVG files. I looked a lot in BaseTexture and tried loader plugins (e.g. pre), but couldn't find any options to leverage.

Any ideas appreciated, on how to tell the Loader which size the SVG should be rasterized :)
Kind regards
John

Share this post


Link to post
Share on other sites

yes, you can tell texture loader to use given size. please search those questions in pixijs issues https://github.com/pixijs/pixi.js/issues

We also made handy shortcut in latest dev version (pixijs.download/dev/pixi.js)

https://github.com/pixijs/pixi.js/pull/7183

loader.add('logo', 'logo.svg', { metadata: {
  resourceOptions: {
    width: 100
    height: 100
  }
}});

Before that version, options only worked with "Texture.from"

Share this post


Link to post
Share on other sites

Yes, this is exactly what I was looking for! Thank you very much!

I didn't know, that I should search Github for questions. I exspected more bugs etc.

I will try the dev version - hope it doesn't break my typings.

 

Share this post


Link to post
Share on other sites

I installed 6.0.0-rc2 via NPM - but it broke everything ... beneath typing problems I got really strange errors, that its missing a lot of semicolons and stuff. Weird.

Texture.from isn't really working for me, as I am loading a bunch of images and I need to do it async.

Is there a way to provide the resourceOptions by adding them somehow in the "pre" middleware function? I tried to write it in the metadata, but without any effect.

 

Edited by John Forge

Share this post


Link to post
Share on other sites

Hi Ivan!

It's working!

I guess I can't be proud of what I did, but it does the job 😄 I am applying a "monkey patch". I am overwriting the static add, use und fromLoader methods in Texture and TextureLoader with the code extracted from the pull request. Not beautiful, but hey .... waiting for the final release.

If anybody needs this in 5.3.3, let me know.

Best regards

Jonas

Share this post


Link to post
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...

  • Recently Browsing   0 members

    No registered users viewing this page.