帆布清除在Paper.js

有誰知道以清除使用paper.js 我嘗試了常規帆布結算方法畫布的最佳方式，但他們似乎不paper.js帆布清除在Paper.js

工作的Html

<canvas id="myCanvas" style="background:url(images/graphpaper.jpg); background-repeat:no-repeat" height="400px" width="400px;"></canvas> 

<button class="btn btn-default button" id="clearcanvas" onClick="clearcanvas();"  type="button">Clear</button>

的JavaScript/Paperscript

<script type="text/paperscript" canvas="myCanvas"> 
// Create a Paper.js Path to draw a line into it: 
tool.minDistance = 5; 

var path; 
var c=document.getElementById("myCanvas"); 
var ctx=c.getContext("2d"); 

function onMouseDown(event) { 
// Create a new path and give it a stroke color: 
path = new Path(); 
path.strokeColor = 'red'; 
path.strokeWidth= 3; 
path.opacity="0.4"; 

// Add a segment to the path where 
// you clicked: 
path.add(event.point, event.point); 
} 

function onMouseDrag(event) { 
// Every drag event, add a segment 
// to the path at the position of the mouse: 
path.add(event.point, event.point); 

} 


</script>

來源

2013-09-27 craig

c.width = c.width; ctx.clearRect(0,0,c.width,c.height);應該是一個很好的包羅萬象的，如果你還沒有嘗試過。

但是要小心 - 設置畫布寬度將重置畫布狀態，包括所有應用的變換。

快速谷歌把我帶到https://groups.google.com/forum/#!topic/paperjs/orL7YwBdZq4指定另一個（更具體paper.js）解決方案： project.activeLayer.removeChildren();

來源

2013-09-27 15:52:10

你描述上面的命令清除帆布，而不是場景圖。然而，第二個工作得很好。 –

定期結算不起作用，因爲paper.js維持場景圖和圖紙需要爲您的護理。如果要清除在項目中創建的所有項目，則需要刪除實際項目：

project.activeLayer.removeChildren();只要所有項目都位於一個圖層內即可使用。還有project.clear()可以刪除所有內容，包括圖層。

來源

2013-10-10 10:43:15

萬一有人來尋找在JavaScript中缺乏經驗的答案，我做了一個簡單的例子：作爲爾格Lehni提到project.activeLayer.removeChildren();可以用來去除活性層內的所有物品

1）。 2）要反映清潔，你必須撥打paper.view.draw();。

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>Circles</title> 
    <link rel="stylesheet" href="style.css"> 
    <script type="text/javascript" src="paper-full.js"></script> 
     <script type="text/paperscript" canvas="canvas"> 

function onMouseUp(event) { 
    var circle = new Path.Circle({ 
    center: event.middlePoint, 
    radius: event.delta.length/2 
}); 
circle.strokeColor = 'black'; 
circle.fillColor = 'white'; 

} 

</script> 

<script type="text/javascript"> 
    paper.install(window); 
    window.onload = function() { 
     paper.setup('canvas'); 
     document.getElementById('reset').onclick = function(){ 

      paper.project.activeLayer.removeChildren(); 
      paper.view.draw(); 

     } 

    }; 

    </script>  
</head> 
<body> 
    <canvas style="background-color: #eeeeed" id="canvas" resize></canvas> 
    <input id="reset" type="button" value="Reset"/> 
</body> 
</html>

CSS：

html, 
body { 
    margin: 0; 
    overflow: hidden; 
    height: 100%; 
} 

/* Scale canvas with resize attribute to full size */ 
canvas[resize] { 
    width: 58%; 
    height: 100%; 
}

來源

2015-05-08 08:13:41

帆布清除在Paper.js

回答

相關問題