我试图在Wordpress网站中加入Processing.js游戏。我使用Ajax调用从Rawgit获取草图,但是当我预览页面时,它只显示一个空白的画布。这是我的代码的示例版本(现在它用于加载绘制红色椭圆的草图):
<!DOCTYPE html>
<html>
<head>
<link rel='stylesheet' href='https://rawgit.com/Larpee/The-Khan-Quiz/master/style.css' type="text/css"/>
</head>
<body>
<div id="title">Page Name</div>
<div id="game-window"><h5 id="game-title">Game name</h5>
<canvas id="game"></canvas>
</div>
</body>
<script src="https://cdn.jsdelivr.net/processing.js/1.4.8/processing.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
$.get("https://rawgit.com/Larpee/The-Khan-Quiz/master/test.txt", function (game) {
var sketchProc = function (processingInstance) {
with (processingInstance) {
size(400, 400);
frameRate(30);
eval(game);
}
};
var canvas = document.getElementById("game");
var processingInstance = new Processing(canvas, sketchProc);
});
</script>
</html>
您可以尝试使用以下链接查看游戏代码:https://www.khanacademy.org/computer-programming/the-khan-quiz/6282341959729152
有谁知道为什么这不起作用?先谢谢