search

pnp / spfx-reference-scenarios

Work repo for the SPFx in Teams samples
48 stars 40 forks source link

SVG image does not work on card view. #45

Open harshdamaniahd opened 4 weeks ago

harshdamaniahd commented 4 weeks ago

I am dynamically creating an svg image on card view. it worked on desktop. but does not work from team's mobile app eg of the code snipper

` public getSVG(): string { let images=this.state.images;

    return svgToTinyDataUri(`<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" viewBox="0 0 300 300" preserveAspectRatio="xMidYMid meet">
    <!-- Top-left image -->
    <image href="${images[0]}" x="0" y="0" width="150" height="150"/>
    <!-- Top-right image -->
    <image href="${images[1]}" x="150" y="0" width="150" height="150"/>
    <!-- Bottom-left image -->
    <image href="${images[2]}" x="0" y="150" width="150" height="150"/>
    <!-- Bottom-right image -->
    <image href="${images[3]}" x="150" y="150" width="150" height="150"/>
</svg>

`
);

}`

` public get data(): IImageCardParameters {

  return {
    iconProperty:this.properties.imageUrl,
    primaryText: this.properties.description,
    imageUrl: this.getSVG(),
    title: this.properties.title
  };

}`