paperJS を使用して簡単な画像マーカーを作成しました。ここで、すべての座標位置と元に戻すボタンを保存する必要があることを作成するために、元に戻すオプションを追加する必要があります。どうすればこれを行うことができますか? これは私のスクリプトです。
function onMouseDrag(event) {
if(set == 1){
path = new Path.Circle({
center: event.point,
radius: (event.downPoint - event.point).length,
fillColor: null,
strokeColor: '#e9e9ff',
strokeWidth: 1
});
}else if(set == 2){
var rectangle = new Rectangle(event.point, event.downPoint);
var path = new Path.Rectangle(rectangle);
path.fillColor = null;
path.strokeColor = '#e9e9ff';
path.strokeWidth = 1;
}else if(set == 3){
var path = new Path.Line({
from: event.point,
to : event.downPoint,
strokeColor: 'black'
});
}else if(set == 4){
var path = new PointText({
point: event.point,
content: 'The contents of the point text',
fillColor: 'black',
fontSize: 25
});
}
path.removeOnDrag();
};
function onMouseUp(event) {
circles.push(path);
};
そして、これは私のhtmlです。
<div class="menu-list">
<input type="button" value="Circle" onClick="return set=1;">
<input type="button" value="Rectangle" onClick="return set=2;">
<input type="button" value="Line" onClick="return set=3;">
<input type="button" value="Text" onClick="return set=4;">
</div>
<div class="img-mark">
<canvas id="canvas" resize></canvas>
</div>
<div class="mark-list">
</div>