snap.svg

    0熱度

    1回答

    使用snapsvg.io,我說有4條垂直線,它們位於一個盒子的下方,均勻地分佈在盒子的x軸上。 我不知道該怎麼做,是將每條垂直線條加上一條文本標籤,並將每條線均勻地堆疊在每條線上,但是在某些高度並以45度角顯示,以便使文本可讀,跨越每條垂直線,從最左到最右。 每個文本標籤的高度,第一個標籤位於最左邊的垂直線的底部,呈45度角,以此類推穿過下一條垂直線,位於不同的高度位置,呈45度角等等 我有以下,

    0熱度

    1回答

    我有一個尺寸爲200px x 300px的SVG圖像,但基於某些條件,我需要畫出半徑值爲30的小圓圈,條件失敗,並希望它在我的圖像的指定區域上均勻分層(不重疊)。 可能會畫出多個圓圈,但顯然不希望這些圖像脫離圖像,而是在圖像的第一行上繪製5個圓圈時將它們纏繞到下一行。 第2行同樣適用,一旦繪製了半徑爲30的5個圓,則換行到下一行。 我使用的是snapsvg.io,但不確定如何計算圖像的區域,我希望

    0熱度

    1回答

    爲什麼Snap.svg僅對分組元素的某些屬性進行動畫處理?在這個Jsfiddle當元素被分組時,他們爲不透明度和變形設置動畫而不是半徑。當將動畫應用於單個元素時,所有屬性都會生成動畫。我不明白。 (function(){ var s = Snap("#svg"); var c1 = s.circle(10, 10, 10); var c2 = s.circle(50, 20, 10); v

    1熱度

    1回答

    我使用Snap.svg創建懸停地圖動畫,但我似乎遇到了動畫部分的問題。地圖創建於Illustrator,並作爲SVG文件導出,並鏈接到HTML頁面。 一旦我添加下面的代碼,一切都消失了。 veryCold.mouseover(function() { this.animate({ fill: "#ff0000" }, 600); }).mouseout(funct

    0熱度

    1回答

    我正嘗試使用Snap.svg創建SVG動畫。 每次我嘗試應用面膜時,我什麼都看不到。 的代碼是相對簡單的(且在實施例中完美地工作): var open = s.select('.open'); var circle = s.select('.circle').attr({mask:open}); Here's the whole example。我已經註釋了應該使用掩碼的代碼,以便了解我要做

    -1熱度

    1回答

    這個demo。 我想使用Snap.svg製作圖標,所以我希望最終用戶重複HTML以獲取多個圖標。 HTML: <svg class="box"></svg> <svg class="box"></svg> <!-- not work --> <svg class="box"></svg> <!-- not work --> <svg class="box"></svg> <!-- not w

    0熱度

    1回答

    我正在使用snapsvg.io庫並不確定爲什麼下面的代碼不顯示我的矩形與我的svg線元素上的文本。 根據我已經放置我的代碼的順序,我認爲我的矩形/文本組將在我的行上,但不幸的是,情況並非如此,無法弄清楚我做錯了什麼。 的代碼示例中,我有如下: line = s.line(trunkLeftPos, 100, trunkLeftPos, 440); line.attr({ stroke:

    0熱度

    1回答

    我想按順序動畫一個正方形,首先順時針旋轉90度,然後進行簡單的x軸平移。這是我一直在使用捕捉SVG Javascript代碼 r.animate({ transform: 'r90, 100, 200' }, 1000, mina.easein, function() { r.animate({transform: 't 100 0'}, 1000, mina.easein);

    0熱度

    2回答

    我試圖循環this animation問題: svg = document.getElementById("shape"); s = Snap(svg); var l2 = Snap.select('#line2'); animatePath(); function animatePath(){ l2.animate({ d: "M328.2,29.9c-51.6,8.

    0熱度

    1回答

    如何取消Snap.svg中的拖動操作? 我檢查了Docs和Google Group,但沒有發現任何有用的東西。 目前,我正在設置一個var,表示要取消操作,將效果和return恢復爲每回調dragMove,直到拖動操作真正結束。 我在尋找的是一種方法來取消當前正在進行的拖動操作本身,所以沒有更多的回調被調用。 任何想法?