畫布大小不改變Paper.js中的路徑寬度

Question

我試圖得到的效果，當畫布調整大小，但其上繪製的路徑仍然具有相同的寬度。但它會根據畫布寬度改變寬度。我試圖重繪路徑，但紙張對象似乎記住舊的寬度和高度，並縮放路徑，儘管將我的新設置應用於路徑。 也許解決方法是縮放路徑的寬度，但我希望有一個更溫和的解決方案。

---

ANSWER 看來最佳解決方案是縮放路徑和形狀的寬度和半徑。在調整大小後繪製新路徑時，必須將舊寬度和高度傳遞到新的點座標。 也許這不是一個溫和的解決方案，但工程，我沒有看到另一個。

Answer 1

你可以告訴你的畫布自動調整，在這裏看到：

http://paperjs.org/tutorials/getting-started/working-with-paper-js/#canvas-configuration

然後改變它的大小，但它不應該沿着縮放內容。您可以在paper.js網站的所有示例中看到這一點，例如http://paperjs.org/examples/rounded-rectangles/

按比例編程告訴這樣做。

如果您只是按照CSS方式縮放畫布對象，那麼最終會在鼠標事件中放大像素和錯誤的偏移量。

如果你不想使用resize屬性，但仍然需要調整畫布大小，你可以通過調用paper.view.setViewSize(width, height)來完成，它會爲你調整大小，尊重HiDPI設置和全部。

Answer 2

我可能晚了一點，但我最近有同樣的問題，我通過在canvas元素上添加resize屬性來解決它。

HTML

<canvas id="myCanvas" resize="true"></canvas> 

不要忘記明確設置resize等於true（即resize="true"）。

只需具有resize屬性或其他任何值都不會。