SVG編輯器，或者：SVG與JavaScript？

我想從數據庫應用程序創建SVG圖表。然而，我對創建SVG一無所知，所以我想先從一位編輯開始，如果我能找到的話。這應該非常讓我 -SVG編輯器，或者：SVG與JavaScript？

1 - 將圖像中的變焦控制

2 - 地方聲像控制圖像

3 - 做各種事情上鼠標懸停 - 彈出一個數據框，突出顯示圖表點數

4 - 從我自己的數據集中創建散點圖和時間線圖表，包括圖例，座標軸等。

這個想法是，一旦我從編輯器中獲得一個基本模板，我就可以編寫C代碼來直接生成SVG代碼。

我花了數小時尋找，我找不到任何商業或免費應用程序，可以做任何這樣的事情。「SVG編輯器」主要繪製圓形和矩形，這對我來說沒有多大用處。我錯過了什麼嗎？似乎SVG編輯器的開發幾年前就停止了，各種編輯器已經停止了。我什至不能找到類似這樣的SVG代碼。

事實上，我閱讀的越多，看起來我需要在JavaScript中執行此操作，而不是直接創建圖像（但我也不瞭解JavaScript）。我應該去哪個方向的任何想法？我已經看過20個可以繪製圖表的JavaScript庫，但它們中的任何一個似乎都沒有勾選上面的1到3。我還需要在散點圖上疊加多段線，並且很少會這樣做。谷歌圖表很接近，但它不會做最後一個。

哦，我有一個被俘的觀衆，如果我問得好，他們會升級他們的瀏覽器。

謝謝 -

鋁

來源

2011-06-05 EML

我認爲谷歌的圖表會做最後的：

標註的時間線：http://code.google.com/apis/ajax/playground/?type=visualization#annotated_time_line

分散：http://code.google.com/apis/ajax/playground/?type=visualization#scatter_chart

來源

2011-06-06 01:48:37

這對時間線很棒，但它不能覆蓋散點圖上的線條，所以它們沒有多大用處。顯然可以創建新的可視化，但我找不到有關如何執行此操作的任何文檔。 – EML 2011-06-06 10:24:01

對不起，還沒有制定出評論，所以上面的2有點突然 - CR做了'添加評論'？！ – EML 2011-06-06 10:36:17

這個組合圖表能爲你找到你想要的嗎？ http://code.google.com/apis/ajax/playground/?type=visualization#combo_chart – 2011-06-06 13:51:50

的Inkscape程序是SVG編輯器。它也允許你attach javascript它的元素。但是，它實際上並沒有顯示出效果。但是，如果您將其加載到現代瀏覽器中，您可以看到交互式效果。你必須知道JavaScript，但它主要涉及添加處理程序，調整CSS屬性或更改屬性。

來源

2011-06-06 02:02:11 Keith

我還沒有試過Inkscape，但是我確實花了半小時的時間閱讀文檔。據我所知，它基本上只是一個插圖包。我需要一些足夠聰明的東西來嵌入縮放和平移/滾動窗口小部件到生成的SVG中，以及一些鼠標事件的管理。如果我要去使用Javascript，那麼我可能會咬緊牙關，在Javascript中做所有事情，使用20或30個Javascript圖表庫中的一個。 – EML 2011-06-06 10:30:18

那麼看看拉斐爾。 – Keith 2011-06-06 10:35:06

我看了一下gRaphael，它專門用於製圖（也許還有20個其他的JavaScript庫）。這個演示很糟糕，所以我不認爲我會詳細看看它。在Javascript庫中，Highcharts可能是從網站看來最好的。 – EML 2011-06-06 16:18:42

如果您要編寫C來生成SVG代碼，那麼您可以在SVG自身內編寫EMCAScript以進行平移，縮放和各種鼠標懸停效果。我已經寫了如何添加平移和縮放控制的說明：http://www.petercollingridge.co.uk/interactive-svg-components/pan-and-zoom-control

來源

2011-06-29 20:33:44

SVG編輯器，或者：SVG與JavaScript？

回答

相關問題