svg就像一張無限大的畫布，需通過以下的屬性給它指定顯示區域，尺寸和座標系統之後才能顯示出我們需要的內容。
viewport也叫視口，用來控制畫布區域的大小，主要通過width和height來指定。
可以指定的單位包括：
省略單位則預設使用pt。
寬高各100px
寬高各100em
viewport左上角的點為座標原點(0, 0)，x軸向右不斷變大，y軸向下不斷變大。
如果svg是乙個大畫布，viewbox就是這塊畫布上你想讓人看到的部分。舉例來說，假設整個螢幕是viewport，viewbox就是截圖的那個擷取框，截完了之後再將框中的內容整個顯示在螢幕（viewport）上。
viewbox由以下幾個屬性構成：
viewport。
viewbox從viewport上擷取一塊區域。
然後將擷取的內容鋪滿viewport。
當viewbox的寬高比和viewport的寬高比正好相同時，那沒什麼問題。如果寬高比不一致，就得有個屬性來決定如何顯示了。
這個屬性正是preserveaspectratio。
preserveaspectratio="alignment [meet | slice]"xmidymid meet其中，alignment指定軸和位置：
x和y可以任意組合，比如xminymax，xmaxymid等等。
meet表示按x和y軸中較小的尺寸等比縮小圖形，以使圖形完全填充viewport。
slice表示按x和y軸中較大的尺寸等比放大圖形，並裁剪掉超出viewport的部分。
指定preserveaspectratio為none表示根據不保留寬高比，影象會被擠壓縮放，以適應viewport。
另外，值得一提的是，svg中還能巢狀svg，子svg擁有自己的座標系統，就好像大畫布中的小畫布一樣。
viewport顯示座標軸 SVG 顯示區域
svg就像一張無限大的畫布，需通過以下的屬性給它指定顯示區域，尺寸和座標系統之後才能顯示出我們需要的內容。viewport viewport也叫視口，用來控制畫布區域的大小，主要通過width和height來指定。可以指定的單位包括 pxem expt pccm mmin 省略單位則預設使用pt。寬...
前端web設定熱點區域 通過 SVG
在一張上加熱點區域可以通過標籤來實現，也可以直接使用匯出的 svg 檔案直接完成熱點區域的繪製。通過標籤的方法 https 1 需要先將所需大圖示注出可點選區域後，匯出為svg檔案，嵌入當前html檔案中。body oncopy return false oncut return false ons...
顯示區域的大小
顯示區域的大小 如果您使用過現有的windows應用程式，可能會發現視窗的尺寸變化極大。視窗最大化時 假定視窗只有標題列並且沒有選單 顯示區域幾乎佔據了整個螢幕。這一最大化了的顯示區域的尺寸可以通過以sm cxfullscreen和sm cyfullscreen為引數呼叫getsystemmetri...