Paper.js -将` `paperscript`‘转换为’`javascript`‘
Paper.js -将` `paperscript`‘转换为’`javascript`‘
提问于 2016-04-08 11:35:33
我想要改变这个paperscript
<script type="text/paperscript" canvas="canvas-1">
tool.minDistance = 10;
tool.maxDistance = 45;
var path;
function onMouseDown(event) {
path = new Path();
path.fillColor = new Color({ hue: Math.random() * 360, saturation: 1, brightness: 1 });
path.add(event.point);
}
function onMouseDrag(event) {
var step = event.delta / 2;
step.angle += 90;
var top = event.middlePoint + step;
var bottom = event.middlePoint - step;
path.add(top);
path.insert(0, bottom);
path.smooth();
}
function onMouseUp(event) {
path.add(event.point);
path.closed = true;
path.smooth();
}
</script>一个独立的javascript：
paper.install(window);
window.onload = function() {
paper.setup('myCanvas');
tool.minDistance = 10;
tool.maxDistance = 45;
var path;
function onMouseDown(event) {
path = new Path();
path.fillColor = {
hue: Math.random() * 360,
saturation: 1,
brightness: 1
};
path.add(event.point);
}
function onMouseDrag(event) {
var step = event.delta / 2;
step.angle += 90;
var top = event.middlePoint + step;
var bottom = event.middlePoint - step;
path.add(top);
path.insert(0, bottom);
path.smooth();
}
function onMouseUp(event) {
path.add(event.point);
path.closed = true;
path.smooth();
}
}它给了我一个错误：
TypeError:未定义不是对象(计算'tool.minDistance = 10')
tool在这里是什么？我知道我可能需要申报它才能使用它。知道怎么解决这个问题吗？
回答 2
Stack Overflow用户
回答已采纳
发布于 2016-04-08 11:46:54
您需要按照文档中概述的全局范围：
paper.install(window);那就继续进行全球防御。：
window.onload = function() {
// Get a reference to the canvas object
paper.setup('myCanvas');
// In your case create tools
var tool = new Tool();
tool.minDistance = 10;
tool.maxDistance = 45;然后像往常一样继续，这将设置你的工具。更多的信息可以找到这里。
顺便说一句，您实际上已经为Path()正确地做了这件事，所以同样适用于Tool()
Stack Overflow用户
发布于 2016-05-06 11:18:22
当我在javascript中直接使用Paper.js时，我更喜欢这样创建纸张对象：
var canvas = document.getElementById('canvas-line');
paper.setup(canvas);
// and then if you want to create some Paper.js object prefix it's name with paper
var myPath = new paper.Path();如果要使用工具，则需要使用新的paper.Tool()对其进行减速；例如，如果要检查是否单击了路径：
var tool1 = new paper.Tool();
var handle;
var myPath;
myPath.fullySelected = true;
tool1.onMouseDown = function(event) {
handle = null;
// Do a hit test on path for handles:
var hitResult = myPath.hitTest(event.point, {
handles: true,
fill: true,
stroke: true,
segments: true,
tolerance: 2
});
if (hitResult) {
if (hitResult.type == 'handle-in') {
handle = hitResult.segment.handleIn;
} else if (hitResult.type == 'segment') {
handle = hitResult.segment.point;
} else if (hitResult.type == 'handle-out') {
handle = hitResult.segment.handleOut;
}
}
}您可以在这里找到更多关于工具的信息，http://paperjs.org/reference/tool/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/36498580
复制相关文章
相似问题
腾讯云开发者
