👀 See Sanity in action: Watch product demo now →

How to use the Sanity CDN to Transform SVG Images to Bitmap/PNG Images

4 replies
Last updated: Nov 12, 2021
is it possible to use the Sanity CDN to transform SVG images to bitmap/png images? My PDF generator hates SVG images
Nov 9, 2021, 11:10 AM
Very cool, how do I do this in my GROQ query? Any ways to to say “If svg, then convert to png/jpg” or do I have to find every place an SVG may come and convert all the images to png or jpg?
I can use the URL, but my current setup works using GROQ
Nov 9, 2021, 12:08 PM
Very sexy, how do I do this in my GROQ query? Any ways to to say “If svg, then convert to png/jpg” or do I have to find every place an SVG may come and convert all the images to png or jpg?
Nov 9, 2021, 12:08 PM
Depends on how your query is, but in theory yes. Something like this:

*[_type == 'blogPost'] [0...10] {
  images[] {
    asset->{
      url,
      extension == 'svg' => {
        'url': url + '?fm=png'
      }
    }
  }
}
Nov 12, 2021, 4:17 AM
The relevant part here is the 'select the url, and if the extension of the asset is svg, assign url to be the url + a query parameter'
Nov 12, 2021, 4:18 AM

Sanity.io – build remarkable experiences at scale

Sanity is a customizable solution that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.