gpt4 book ai didi

javascript - 可汗学院计算机程序如何离线运行或在我自己的网站上运行?

转载 作者:可可西里 更新时间:2023-11-01 02:19:24 26 4
gpt4 key购买 nike

我在 Khan Academy's Computer Programming lessons 开发过程序我想跑出可汗学院。怎么办?

最佳答案

可汗学院使用 Processing.js ,一个用于与 <canvas> 交互的 JavaScript 库元素。尽管 Processing 实际上本身就是一种语言,但可汗学院使用 JavaScript-only Processing.js code .

所以你需要设置一个导入Processing.js的网页,设置一个<canvas> ,并在 Canvas 上构建一个 Processing.js 实例。最后,您需要确保您的可汗学院代码在范围内包含 Processing.js 实例的所有成员(我使用 with 执行此操作),加上一些等效的 Khan Academy's small modifications to Processing.js , 比如 mouseIsPressedgetImage .

这是一些一直为我工作的样板。可能需要进一步的开发才能使其适用于更复杂的示例;当您发现不起作用的示例时,请发表评论。

<!DOCTYPE html>
<html>
<head>
<title>JavaScript</title>
<script src="http://cdnjs.cloudflare.com/ajax/libs/processing.js/1.4.8/processing.min.js"></script>
</head>
<body>
<canvas id="canvas"></canvas>
<script>
var canvas = document.getElementById("canvas");
var processing = new Processing(canvas, function(processing) {
processing.size(400, 400);
processing.background(0xFFF);

var mouseIsPressed = false;
processing.mousePressed = function () { mouseIsPressed = true; };
processing.mouseReleased = function () { mouseIsPressed = false; };

var keyIsPressed = false;
processing.keyPressed = function () { keyIsPressed = true; };
processing.keyReleased = function () { keyIsPressed = false; };

function getImage(s) {
var url = "https://www.kasandbox.org/programming-images/" + s + ".png";
processing.externals.sketch.imageCache.add(url);
return processing.loadImage(url);
}

// use degrees rather than radians in rotate function
var rotateFn = processing.rotate;
processing.rotate = function (angle) {
rotateFn(processing.radians(angle));
};

with (processing) {


// INSERT YOUR KHAN ACADEMY PROGRAM HERE


}
if (typeof draw !== 'undefined') processing.draw = draw;
});
</script>
</body>
</html>

关于javascript - 可汗学院计算机程序如何离线运行或在我自己的网站上运行?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25341597/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com