2017-02-18 8 views
0

Ich habe eine SVG-Bilddatei, die nicht das vollständige Bild zeigt, wenn ich es von einer externen Seite aufrufen. Es zeigt nur etwa die Hälfte des Bildes. Weiß jemand warum?SVG Bilddatei zeigt nicht das ganze Bild

INDEX.HTML

<!DOCTYPE html> 
<html lang="en"> 
<head> 

<meta charset="UTF-8"> 
<title></title> 


<style type="text/css"> 

</style> 

</head> 

<body> 

<svg class="icon"><use xlink:href="image.svg#Layer_1" /></svg> 


<script> 

</script> 

</body> 

</html> 

IMAGE.SVG

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" 
width="433px" height="433px" viewBox="0 0 433 433" enable-background="new 0 0 433 433" xml:space="preserve"> 
<circle fill="#00AEEF" stroke="#000000" stroke-width="7" stroke- miterlimit="10" cx="216.5" cy="216.5" r="213"/> 
</svg> 

Antwort

1

Wenn Sie nicht angeben, Breite und Höhe auf dem Root-svg Element, wird es auf beliebige Dimensionen von "default 100% ", versuchen Sie also explizit, die Dimensionen in INDEX.HTML wie folgt zu setzen:

<svg class="icon" width="433px" height="433px"><use xlink:href="image.svg#Layer_1" /></svg>