在某些圖形編輯器中使用Html5/Javascript圖形

我得到了一些使用JavaScript/Html5 Canvas製作的圖形設計。在某些圖形編輯器中使用Html5/Javascript圖形

現在，我需要給這個圖形元素，以平面設計師以某種格式他可以工作：在Photoshop或Illustrator中友好的格式。

現在，我當然可以截圖並開始按照我的方式工作，但是我確實需要這種圖形以矢量格式，我可以稍後使用更強大的圖形。

有沒有辦法將上面提到的代碼轉換成圖形？也許將其轉換爲SVG？

2012-01-05 Talbatz

我不認爲這是可能的。 – noob 2012-01-05 15:37:28

我不知道一種方式，但請注意，畫布是基於像素的*，因此將畫布圖像轉換爲SVG實際上不可行。 – pimvdb 2012-01-05 15:38:34

謝謝你們，pimvdb - 你是對的，canvas是像素化的，但是在這種情況下，canvas僅用於展示JavaScript矢量。所以我們正在尋找從畫布到矢量的javascript-to-vector轉換...對不起，如果我不清楚這個 – Talbatz 2012-01-05 16:08:48

退房SVGCanvas定義與創建SVG HTML5畫布兼容的API輸出來自繪圖命令。它可能不處理所有事情，但你的簡單示例應該可以正常工作。

只需將代碼的相關位粘貼到left textareas之一中，然後單擊「執行」，然後從右側的textarea複製svg輸出。

2012-01-05 16:58:33

這個伎倆！非常感謝：-） – Talbatz 2012-01-14 22:53:41

像其他人一樣評論，沒有工具可以幫助您製作畫布 - > SVG轉換。但是，代碼並不太相同。因爲你給的樣品是相當小的，你可以使用Raphaël.js產生SVG和轉換張貼到Raphael.js代碼：

UPDATE

更詳細一點

包括Raphael.js
經過一行腳本線，並試圖找到等效於Raphael.js。例如，你正在做的RGB顏色的東西這樣做：http://raphaeljs.com/reference.html#Raphael.rgb
運行生成的JS
保存生成的SVG

2012-01-05 15:52:19 Milimetric

嘿，這聽起來像是一個可能的解決方案......請您詳細說明一下嗎？我必須承認我完全不瞭解你 – Talbatz 2012-01-05 16:05:40

當然，讓我知道什麼不清楚。 – Milimetric 2012-01-05 16:35:11

謝謝！你的更新清除了什麼不清楚:-) – Talbatz 2012-01-06 18:31:01

回答