如何讓svg從div的另一個位置開始

在Raphael JS文檔中，有一些示例如何使svg只在左上角。如何讓svg從div的另一個位置開始

//在#notepad元件的左上角被創建畫布
//（或在其DIR右上角= 「RTL」元素）
VAR 紙=聖拉斐爾（的document.getElementById（「記事本」），320,200）;

如何讓它不從左上角開始，例如從x = 0和y = 50開始？

來源

2012-02-08 Chuck Norris

您想讓您的svg元素位於頂部：50px，left：#notepad元素的0位置？這是你的意思嗎？ – czerasz 2012-02-08 11:49:10

是的，你是對的:) – 2012-02-08 11:53:12

這可能不是關於CSS和更多關於SVG的內容。您可以使用CSS在HTML中定義容器，但在其內部最好使您的定義與SVG數據直接相關。特別是這種情況下，有以下屬性：

視框
preserveAspectRatio

在你將要值「xMinYMid相遇」是第二屬性。這將導致SVG圖像從其可用畫布的垂直中心和左邊緣進行渲染。您還可以刪除SVG上的寬度和高度屬性，因爲這與矢量圖形的渲染不直觀。

我已經成功地將SVG圖形轉換成幻燈片應用程序的三個地方，http://mailmarkup.org/slideshow.xhtml

出現在行情開始時的報價圖形
在頁腳
SMTP和標誌HTTP通過中間的幻燈片上的圖表

如果您縮小或增大瀏覽器窗口，圖形將保留在正確的位置，拉丁文本。

來源

2012-02-08 12:11:11 austincheney

謝謝，我用viewBox做到了））） – 2012-02-10 12:07:28

-1

試試這個：

#notepad { 
    position:relative; 
} 
    #notepad svg { 
    position:absolute; 
    top:50px; left:0; 
    }

來源

2012-02-08 11:55:54 czerasz

給你的SVG的CSS的相對位置屬性，並通過頂部/底部和左側/右側，你可以根據DIV中所需的位置設置SVG。

<svg id="mSvg" height="539" version="1.1" width="620" xmlns="http://www.w3.org/2000/svg"> 
#msvg { 
overflow: hidden; 
top: 40px; 
left: 100px; 
position: relative; 
}

來源

2012-02-08 11:56:46

如何讓svg從div的另一個位置開始

回答

相關問題