在dart中創建一個路徑：svg

我剛剛使用Dart，並且我一直在嘗試移植一些與svg一起工作的javascript代碼，並在其中創建了一些包含段的路徑， m努力瞭解它的API如何工作。在dart中創建一個路徑：svg

下面的代碼將不會運行，但它也許說明了我想做些什麼：

Element i = query("#divsvg"); 
svg.SvgSvgElement s = new svg.SvgSvgElement(); 
i.append(s); 

svg.PathElement p = new svg.PathElement(); 
p.pathSegList.add(
     p.createSvgPathSegArcAbs(200, 200, 50, 50, 180, false, false) 
    ); 

s.children.add(p);

然而，據我從文檔理解：

createSvgPathSegArcAbs創建一個未合併的路徑段
pathSegList是最終的，因此在構建後無法添加
PathElement構造函數似乎沒有任何參數

我是否缺少關於Dart如何工作的內容，或者有關svg庫文檔的內容？我花了幾個小時看文檔，使用Google搜索並查看測試，但是我還沒有發現任何似乎涵蓋此內容的東西（測試似乎使用HTML代碼而不是API來創建東西）。

任何能夠讓我指向正確方向的東西將會非常感謝！

更新

我花了更多的時間在看的功能，以及在pathSegList的「終局」不應該阻止它正在改變（這不是常量），剛剛更換。

但是，像「add」這樣的各種函數，如果你嘗試調用它們，就會被異常顯式地實現，而一些函數（如append）則是本地實現的。

根據調試器：

p.pathSegList.append(
    p.createSvgPathSegArcAbs(200, 200, 50, 50, 180, false, false) 
);

將追加的路徑segement，但這不會出現在「的innerHTML」屬性，也沒有在最終頁面的HTML ...

我開始認爲svg支持不是一個「完成的」，而且我有點試圖轉向畫布和/或WebGL。

來源

2013-04-22 Dan

作爲參考，https://github.com/mythz/dart-samples/blob/ master/samples/logo/logo.dart是一個例子，其中整個svg標籤是從原始輸入創建的，但我無法找到一個動態SVG或通過API進行操作的示例。 – Dan 2013-04-23 13:43:47

我能夠創建路徑元件和使用的PathSegList的appendItem方法路徑段添加到它：

var div = query('#container'); 
var svgElement = new svg.SvgSvgElement(); 
div.append(svgElement); 
path = new svg.PathElement(); 
svgElement.append(path); 

segList = path.pathSegList; 

segList.appendItem(path.createSvgPathSegMovetoAbs(50, 50)); 
segList.appendItem(path.createSvgPathSegArcAbs(200, 200, 50, 50, 180, false, false)); 
segList.appendItem(path.createSvgPathSegClosePath());

來源

2013-08-01 15:05:41 ringstaff

在dart中創建一個路徑：svg

回答

相關問題