在jQuery getJSON之后加载PaperScript

Load PaperScript after jQuery getJSON

本文关键字：加载 PaperScript 之后 getJSON jQuery      更新时间：2023-09-26

我想画一个纸上的JS路径作为getJSON回调。我的代码有效，但要呈现路径，我必须将鼠标悬停在<canvas>上。该脚本也应该在移动设备上运行，因此我需要在没有鼠标交互的情况下让脚本在页面加载时工作。这是我的代码：

$(function() {
    paper.install(window);
    var jsonURL = "http://www.domain.com/file.json";
    $.getJSON( jsonURL, function (data){
        paper.setup('myCanvas');
        var point_1_x = data['point1']['x'];
        var point_1_y = data['point1']['y'];
        var point_2_x = data['point1']['x'];
        var point_2_y = data['point1']['y'];
        var myPath = new Path();
        myPath.strokeWidth = 10;
        myPath.strokeColor = 'black';
        myPath.add(new Point(point_1_x,point_1_y));
        myPath.add(new Point(point_2_x,point_2_y));
        paper.PaperScript.load(); // I tried this one
    }
});

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Tool</title>
    <link rel="stylesheet" href="css/styles.css">
    <script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
    <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/paper.js/0.9.25/paper-full.js"></script>
    <script type="text/javascript" src="mypaperscript.js"></script>
</head>
<body>
    <div class="wrapper">
        <canvas id="myCanvas" keepalive="true"></canvas>
    </div>
</body>
</html>

问题已解决：

将 paper.view.update（）; 添加到 getJSON（） 的末尾;

相关文章：