将paperjs与jsfiddle一起使用

Using paperjs with jsfiddle

本文关键字：一起 jsfiddle paperjs      更新时间：2023-09-26

我刚刚发现了paperjs，一个很棒的矢量图形框架，你可能已经听说过了。

我偶然发现了一个问题，我绝对无法弄清楚如何让它与 jsfiddle 一起工作！我在网上找到的几个例子之所以有效，是因为所有代码都卡在 HTML 部分的 paperscript 标签中。

知道如何使"Javascript"部分工作，从而利用语法着色吗？

多谢！

默认情况下，

您不能将 paperjs 代码放在 javascript 面板中。你需要破解jsFiddler来做到这一点。查看来自 jsFiddler 的文档

请将代码包装设置为无换行（头）（默认为 onLoad），将 Franework 设置为无库（纯 JS）。

与 CoffeeScript 类似，Paperscript 要求脚本标签是 text/paperscript 的类型，并在 canvas 参数中提供 canvas 元素的 id。在 HTML 面板中输入以下内容，您将能够在 JavaScript 面板中编写 Paperscript。

<canvas id="some-unique-id" resize keepalive="true" style='height: 200; width: 200;'>    </canvas>
<script>(function(){var s="script",n=''n',d=document,b=d.getElementsByTagName(s)[2].innerHTML.split(n);d.write('<'+s+' type="text/paperscript" canvas="' + document.getElementsByTagName('canvas')[0].id + '">'+b.slice(2,b.length-2).join(n)+'</'+s+'>')})()</script>

示例：http://jsfiddle.net/zalun/LrGEm/12/

还有 sketch.paperjs.org

Sketch.paperjs.org

或者

，您可以使用 https://www.jsbin.com 进行编码。它将允许在javascript占位符中编写JS。

相关文章：