SVG背景不適用

我做了一個簡單的SVG圖像，但背景不適用，而應該使用。SVG背景不適用

我得到了下面的代碼至今：

<?xml version="1.0" encoding="utf-8"?> 
<svg xmlns="http://www.w3.org/2000/svg" id="content" width="100%" height="100%" viewbox="0 0 800 1000" preserveaspectratio="xMidYMid meet" version="1.1"> 
    <defs> 
    <lineargradient id="gradient" x1="0%" y1="0%" x2="0%" y2="100%"> 
     <stop offset="0%" stop-color="#ffffff" stop-opacity="0"/> 
     <stop offset="100%" stop-color="orange" stop-opacity="0.8"/> 
    </lineargradient> 
    <lineargradient id="gradientLine" x1="0%" y1="0%" x2="0%" y2="100%"> 
     <stop offset="0%" stop-color="orange" stop-opacity="0"/> 
     <stop offset="100%" stop-color="orange" stop-opacity="0.6"/> 
    </lineargradient> 
    </defs> 
    <g id="vis" transform="translate(330,670)"> 
    <path fill="url(#gradient)" d="M-112.87131548350527,-640.1250394579351A650,650 0 0,1 222.31309316168483,-610.8002035108404L0,0Z"/> 
    <circle r="35" stroke="orange" fill="orange" opacity="1"/> 
    <circle r="3" stroke="black" fill="black" opacity="1"/> 
    <line x1="0" x2="-85" y1="0" y2="0" fill="black" stroke="black"/> 
    </g> 
</svg>

的path是黑色的，但它應該是一個梯度會從白色到橙色。

顯然，當我在jsfiddle中運行我的代碼時，它顯示出良好的結果。但是當我嘗試在img標籤中顯示SVG或直接在瀏覽器中顯示時，我得到了黑色背景。任何想法？

我做錯了什麼或這是一個常見問題？

感謝您的幫助。

來源

2014-02-26 Manitoba

我認爲這個問題是在這裏：

<lineargradient id="gradient" x1="0%" y1="0%" x2="0%" y2="100%">

修正：

<linearGradient id="gradient" x1="0%" y1="0%" x2="0%" y2="100%">

來源

2014-02-26 09:02:59

它並沒有解決我的問題：http://i.imgur.com/seDJ6JA.png – Manitoba

我期望得到：http://i.imgur.com/XKj1YkY.png – Manitoba

顯然，當我在jsfiddle中運行我的代碼時，它顯示出良好的結果。但是當我嘗試在img標籤中顯示SVG或直接在瀏覽器中顯示時，我得到了黑色背景。任何想法？ – Manitoba

SVG背景不適用

回答

相關問題