Photoshop自定義形狀到SVG路徑字符串

Question

有沒有什麼辦法讓SVG路徑字符串脫離Photoshop自定義形狀或路徑？還是有另一種方法來獲取/構建類似的數據？我希望做一些類似這樣：

http://raphaeljs.com/icons/

Answer 1

更新：在最近版本的Photoshop，有一個內置選項將圖像導出爲SVG，這在路徑和自定義形狀上運行良好。只需要：

文件 - >導出 - >導出爲...並在文件設置中選擇SVG。

原來的答案：

從Photoshop CC 14.2開始，你可以直接從Photoshop創建SVG文件：

1. 創建一個與用戶主文件夾下的內容命名generator.json文件。
2. 重新啓動Photoshop並打開您的PSD文件。
3. 激活生成器：File> Generate> Image Assets。
4. 將您的圖層重命名爲<something>.svg。
5. svg文件將在PSD文件旁邊的資產目錄中創建。

發電機的內容。JSON：

{ 
    "generator-assets": { 
     "svg-enabled": true 
    } 
} 

來源：http://creativedroplets.com/generate-svg-with-photoshop-cc-beta/

Answer 2

1. 選擇並在Photoshop拷貝的路徑
2. 啓動Adobe Illustrator中
3. 創建一個新文檔
4. 粘貼
5. 保存如SVG

如果你有ve Illustrator並沒有創建所有路徑，但是，直接在Illustrator中創建它們可能更容易。

如果您沒有Illustrator，則最好使用免費的Inkscape SVG編輯器繪製路徑。

如果你已經有Photoshop中的路徑，並且沒有Illustrator，我能想到的最好的方法是打開Photoshop中的Info調色板，一次選擇一個路徑點並手動記錄指向它本身以及它的手柄，並從這些手動創建路徑使用absolute curveto commands, 'C'（對於帶柄的點）和absolute lineto commands, 'L'對於那些沒有手柄的點。

Answer 3

另一種選擇是將文件保存爲EPS在Photoshop並確保有出口向量檢查，然後加載到這一點插畫並保存爲SVG

Answer 4

所有答案是好的，但對我來說，他們是太多了，有一個由Adobe提供了一個在線工具：

http://adobe.com/go/extract_tryitnow_en

所有你必須要做的是上傳/拖動& drop/your.psd文件，選擇路徑圖層並下載爲svg。您可以提取svg路徑，特別是d屬性。

我做又是什麼把path爲g元素，然後按比例g和翻譯path

Answer 5

對於自定義形狀，你可能想看看所謂的Convert Custom Shapes File to SVG Set最近發佈的開源腳本（適用於Photoshop CS3或更高版本），用於將自定義形狀文件（.csh）或自定義形狀首選項文件（CustomShapes.psp）轉換爲一組SVG文件。