爲打印機輸出創建和縮放SVG

我有一個應用程序可以創建一個大約300 x 150像素的基本svg圖塊。我需要複製此圖塊，以便在兩個A4頁面或單個A3頁面上創建一個漂亮的打印輸出。所以，基本上，我只是在頁面佈局101，在svg而不是Photoshop /任何。爲打印機輸出創建和縮放SVG

任何人都可以給我任何指示如何開始呢？目前，我做起來很天真：

集的大帆布，大約1500 * 1500px
複製瓦4×6次在JavaScript在瀏覽器
打印

這或多或少都可以通過，但看起來不太好。這將有助於設置A4頁面的物理尺寸的畫布嗎？如果我這樣做，那麼我就會遇到這樣的問題，即該圖塊是我目前使用像素單元創建的複雜圖形。即使我這樣做，瀏覽器大概會忽略畫布大小。或者我應該先轉換爲pdf？如果我這樣做，我仍然需要解決如何設置一個可以很好轉換爲pdf的svg'頁面'。而且有什麼工具實際上支持svg 1.2頁面的東西？

請注意，我不能使用Inkscape，因爲我的svg代碼完全是JavaScript。

來源

2012-05-15 EML

你能否提供一些截圖展示它看起來不太好的方式？如果你可以提供一個理想的jsfiddle，因爲人們可以感覺到發生了什麼問題。另外，你如何從SVG轉換爲PDF？據推測，你在服務器上做了那麼一點？ – halfer

想象一下在A4上打印的Word文檔，其中10pt文本以14pt出現，右邊距離離開，並且分頁符丟失，並且您在那裏。發佈前我沒有嘗試過PDF轉換，但我現在嘗試了wkhtmltopdf。如果我將畫布設置爲297x210mm，並且運行wkhtmltopdf時沒有智能縮放，並且邊距爲零，則輸出將適合A4頁面，儘管不是居中。接下來的問題是找到一些設置視圖框的邏輯，這讓我可以設計像素。我想我可能不得不放棄像素並移動到磅和釐米。 – EML

請勿爲此使用畫布！

SVG的要點是可縮放的圖形。您可以在瀏覽器中自行縮放SVG，然後從那裏打印。

如果你想擴展SVG那麼所有你需要做的就是無論是應用CSS規模：

http://jsfiddle.net/simonsarris/xYZyf/

或SVG規模：

http://jsfiddle.net/simonsarris/xYZyf/1/

來源

2012-06-24 00:44:52

截至2014年7月，CSS規模在基於webkit的瀏覽器中似乎不起作用 –

爲打印機輸出創建和縮放SVG

回答

相關問題