質問

So, I created this basic SVG using Inkscape. I created a New "icon_32x32", then saved it as "Plain SVG (*.svg)". I embed it into my page with: <embed src="~/Content/images/circle.svg" type="image/svg+xml" />

Just as a test, I wanted to try to increase it from 32x32 to 250x250. I was reading over how to increase the size and thought I was following the steps correctly, but why isn't my SVG getting larger?

Here is the SVG:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>

<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
version="1.1"
id="svg2985"
width="250"
height="250"
viewbox="0 0 250 250"
preserveaspectratio="xMidYMid meet">
<defs
 id="defs2987">
 <marker
    refX="0"
    refY="0"
    orient="auto"
    id="Arrow2Lend"
    style="overflow:visible">
   <path
     d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
     transform="matrix(-1.1,0,0,-1.1,-1.1,0)"
     id="path3981"
     style="fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" />
</marker>
</defs>
<metadata
 id="metadata2990">
<rdf:RDF>
  <cc:Work
     rdf:about="">
    <dc:format>image/svg+xml</dc:format>
    <dc:type
       rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
    <dc:title></dc:title>
  </cc:Work>
</rdf:RDF>
</metadata>
<g
 id="layer1">
<path
   d="m 16.001558,18.25189 a 4.7833748,4.5634494 0 1 1 0,-9.1213392"
   transform="matrix(0.42504196,0,0,0.39488694,10.250724,10.593505)"
   id="path3767"
   style="fill:none;stroke:#ff0000;stroke-width:0.96631217;stroke-miterlimit:4;stroke-dasharray:none" />
</g>
<g
 id="layer2">
<path
   d="m 8.6592145,8.2026817 a 1.9587629,2.5567009 0 1 1 0,-5.1063941"
   transform="matrix(-1.6047615,0,0,1.1886138,30.932625,9.2768872)"
   id="path3774"
   style="fill:none;stroke:#000000;stroke-width:1.50029838;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;marker-start:none;marker-mid:none" />
</g>
</svg>
役に立ちましたか?

解決

You seem to have converted some of the file to lower case which is not valid as SVG is case sensitive.

viewbox="0 0 250 250"
preserveaspectratio="xMidYMid meet">

must be written

viewBox="0 0 250 250"
preserveAspectRatio="xMidYMid meet">

In addition, you've presumably changed both the width/height and the viewBox size when you should have only changed the width/height if you revert the viewBox to `viewBox="0 0 32 32" then it should display larger.

The width/height controls how big the drawing is, the viewBox controls how much area the contents covers i.e. it scales the contents so if you change both you end up with a bigger drawing scaled down i.e. no change.

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top