Использование хан программ академии на сайтах

Я учусь в Академии Хана, чтобы изучать кодирование, и там я добился значительных успехов. Я также выучил немало HTML, CSS и JS в моем колледже. Мне было интересно, есть ли способ сыграть мою игру (в Академии Хана, написанную на ProcessingJS) как автономную HTML-страницу.

Теперь я провел довольно много исследований, прежде чем спрашивать здесь. Я пробовал следующее:

1. Этот HTML шаблон на ханскую академию.
2. Этот шаблон тоже.
3. И этот на переполнении стека тоже.

Использование любого из вышеперечисленных шаблонов дает мне недоделанный вывод, и кажется, что управление с клавиатуры не работает. Также нет анимации.

Заранее спасибо!

1 ответ

Решение

Бесстыдная самореклама: я написал учебник по развертыванию Processing.js, доступный здесь.

По сути, вы можете создать "автономную" версию своей страницы, загрузив библиотеку Processing.js, которую вы можете получить здесь.

Если у вас есть это, то это просто вопрос загрузки этого файла в .html файл. Вот пример index.html файл:

<!DOCTYPE html>
<html>
    <head>
        <title>My Sketch</title>
        <script src="processing.js"></script>
    </head>
    <body>
        <script type="application/processing">
            void setup(){
                size(200, 200);
            }

            void draw(){
                background(64);
                ellipse(mouseX, mouseY, 20, 20);
            }
        </script>
        <canvas> </canvas>
    </body>
</html>

В этом случае processing.js файл находится рядом с index.html файл, а <script src="processing.js"></script> линия загружает его. Затем вы можете использовать Processing.js в вашем JavaScript. Вы также можете использовать отдельный .pde или же .js файл, содержащий ваш код Processing.js.

Стоит также отметить, что между Khan Academy и vanilla Processing.js есть несколько тонких отличий, таких как использование радиан и степеней.

Фактически, с этого момента кто-то дал возможность почти всем проектам Khan Academy работать в автономном режиме...

И это я, разве я не классный? Да Да что угодно. В любом случае просто нажмите эту ссылку:https://github.com/prolightHub/KaTemplate

Шаги: Загрузите, загрузите его и извлеките туда, где хотите. Затем переименуйте папку и название в index.html.

Затем откройте js / index.js

И поместите свой код в функцию:

function main()
{
    // Paste your Khan Academy code here
}

createProcessing(main);

Откройте index.html

И все должно работать... Если есть вопросы, просто задавайте мне.

Другие вопросы по тегам