將 GlowScript 線上版 VPython 動畫發布到 Blogger

步驟

1. 開啟要發布的 GlowScript 線上版動畫編輯視窗，也就是程式碼頁面，不是動畫頁面。
2. 點選發布動畫的連結，英文是 Share or export this program。
3. 複製下方格子中的 HTML 程式碼，進到 Blogger 編輯文章畫面，於 HTML 檢視 模式下貼上剛才複製的程式碼。
4. 刪除第4行的程式碼就可以發布了。

<link type="text/css" href="https://www.glowscript.org/css/ide.css" rel="stylesheet" />

發布的動畫

以下的動畫是以 進階教材：按鈕 線上版為例。

以下是這個動畫的 HTML 程式碼

<div id="glowscript" class="glowscript">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link type="text/css" href="https://www.glowscript.org/css/redmond/2.1/jquery-ui.custom.css" rel="stylesheet" />
<link type="text/css" href="https://www.glowscript.org/css/ide.css" rel="stylesheet" />
<script type="text/javascript" src="https://www.glowscript.org/lib/jquery/2.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.glowscript.org/lib/jquery/2.1/jquery-ui.custom.min.js"></script>
<script type="text/javascript" src="https://www.glowscript.org/package/glow.3.2.min.js"></script>
<script type="text/javascript" src="https://www.glowscript.org/package/RSrun.3.2.min.js"></script>
<script type="text/javascript"><!--//--><![CDATA[//><!--

// START JAVASCRIPT
;(function() {;
var ρσ_modules = {};
var running, re, t;
ρσ_modules.pythonize = {};

(function(){
    function strings() {
        var string_funcs, exclude, name;
        string_funcs = set("capitalize strip lstrip rstrip islower isupper isspace lower upper swapcase center count endswith startswith find rfind index rindex format join ljust rjust partition rpartition replace split rsplit splitlines zfill".split(" "));
        if (!arguments.length) {
            exclude = (function(){
                var s = ρσ_set();
                s.jsset.add("split");
                s.jsset.add("replace");
                return s;
            })();
        } else if (arguments[0]) {
            exclude = Array.prototype.slice.call(arguments);
        } else {
            exclude = null;
        }
        if (exclude) {
            string_funcs = string_funcs.difference(set(exclude));
        }
        var ρσ_Iter0 = string_funcs;
        ρσ_Iter0 = ((typeof ρσ_Iter0[Symbol.iterator] === "function") ? (ρσ_Iter0 instanceof Map ? ρσ_Iter0.keys() : ρσ_Iter0) : Object.keys(ρσ_Iter0));
        for (var ρσ_Index0 of ρσ_Iter0) {
            name = ρσ_Index0;
            (ρσ_expr_temp = String.prototype)[(typeof name === "number" && name < 0) ? ρσ_expr_temp.length + name : name] = (ρσ_expr_temp = ρσ_str.prototype)[(typeof name === "number" && name < 0) ? ρσ_expr_temp.length + name : name];
        }
    };
    if (!strings.__module__) Object.defineProperties(strings, {
        __module__ : {value: "pythonize"}
    });

    ρσ_modules.pythonize.strings = strings;
})();
async function __main__() {
"use strict";
    var display = canvas;
    var scene = canvas();

    var version, print, arange, __name__, type, ρσ_ls, d, L, t, dt, re, running, scene, floor, cube, gd, xt, gd2, vt, b1, b2, vslider, vtext;
    version = ρσ_list_decorate([ "3.2", "glowscript" ]);
    Array.prototype['+'] = function(r) {return this.concat(r)}
    Array.prototype['*'] = function(r) {return __array_times_number(this, r)}
    window.__GSlang = "vpython";
    print = GSprint;
    arange = range;
    __name__ = "__main__";
    type = pytype;
    var strings = ρσ_modules.pythonize.strings;

    strings();
    "6";
    d = 10;
    "7";
    L = 200;
    "8";
    t = 0;
    "9";
    dt = .01;
    "10";
    re = false;
    "11";
    running = false;
    "17";
    scene = ρσ_interpolate_kwargs.call(this, canvas, [ρσ_desugar_kwargs({width: 800, height: 400, x: 0, y: 0, background: vec(0, .6, .6), center: vec(0, 5, 0)})]);
    "18";
    scene.title = "1D Motion\n\n";
    "20";
    floor = ρσ_interpolate_kwargs.call(this, box, [ρσ_desugar_kwargs({pos: vec(0, 0, 0), size: vec(L, .1["*"](d), .5["*"](L)), color: color.blue})]);
    "21";
    cube = ρσ_interpolate_kwargs.call(this, box, [ρσ_desugar_kwargs({pos: vec(0, .55["*"](d), 0), size: vec(d, d, d), v: vec(0, 0, 0), color: color.red})]);
    "23";
    gd = ρσ_interpolate_kwargs.call(this, graph, [ρσ_desugar_kwargs({width: 600, height: 450, x: 0, y: 400, xtitle: "<i>t<\/i> (s)", ytitle: "<i>x</i> (cm)", fast: false})]);
    "24";
    xt = ρσ_interpolate_kwargs.call(this, gcurve, [ρσ_desugar_kwargs({graph: gd, color: color.red})]);
    "25";
    gd2 = ρσ_interpolate_kwargs.call(this, graph, [ρσ_desugar_kwargs({width: 600, height: 450, x: 0, y: 850, xtitle: "<i>t</i> (s)", ytitle: "<i>v</i> (cm/s)", ymin: 1["-u"]()["*"](6), ymax: 6, fast: false})]);
    "26";
    vt = ρσ_interpolate_kwargs.call(this, gcurve, [ρσ_desugar_kwargs({graph: gd2, color: color.red})]);
    "29";
    async function run(b1) {
        "30";
        "31";
        running = !running;
        "32";
        if (running) {
            b1.text = "暫停";
        } else {
            b1.text = "執行";
        }
    };
    if (!run.__argnames__) Object.defineProperties(run, {
        __argnames__ : {value: ["b1"]},
        __module__ : {value: null}
    });

    "35";
    b1 = ρσ_interpolate_kwargs.call(this, button, [ρσ_desugar_kwargs({text: "執行", pos: scene.title_anchor, bind: run})]);
    "38";
    async function reset(b2) {
        "39";
        "40";
        re = !re;
    };
    if (!reset.__argnames__) Object.defineProperties(reset, {
        __argnames__ : {value: ["b2"]},
        __module__ : {value: null}
    });

    "42";
    b2 = ρσ_interpolate_kwargs.call(this, button, [ρσ_desugar_kwargs({text: "重置", pos: scene.title_anchor, bind: reset})]);
    "45";
    async function setv(vslider) {
        "46";
        cube.v.x = vslider.value;
        "47";
        vtext.text = "{:1.1f} cm/s".format(vslider.value);
    };
    if (!setv.__argnames__) Object.defineProperties(setv, {
        __argnames__ : {value: ["vslider"]},
        __module__ : {value: null}
    });

    "49";
    vslider = ρσ_interpolate_kwargs.call(this, slider, [ρσ_desugar_kwargs({min: 1["-u"]()["*"](5), max: 5, value: 1, length: 200, bind: setv, right: 15, pos: scene.title_anchor})]);
    "50";
    vtext = ρσ_interpolate_kwargs.call(this, wtext, [ρσ_desugar_kwargs({text: "{:1.1f} cm/s".format(vslider.value), pos: scene.title_anchor})]);
    "51";
    cube.v.x = vslider.value;
    "54";
    async function init() {
        "55";
        "56";
        cube.pos = vec(0, .55["*"](d), 0);
        "57";
        cube.v.x = vslider.value;
        "58";
        t = 0;
        "59";
        xt.remove();
        "60";
        vt.remove();
        "61";
        re = false;
        "62";
        running = false;
        "63";
        b1.text = "執行";
    };
    if (!init.__module__) Object.defineProperties(init, {
        __module__ : {value: null}
    });

    "67";
    async function update() {
        "68";
        "69";
        cube.pos=cube.pos["+"](cube.v["*"](dt));
        "70";
        ρσ_interpolate_kwargs.call(xt, xt.plot, [ρσ_desugar_kwargs({pos: [t, cube.pos.x]})]);
        "71";
        ρσ_interpolate_kwargs.call(vt, vt.plot, [ρσ_desugar_kwargs({pos: [t, cube.v.x]})]);
        "72";
        t=t["+"](dt);
    };
    if (!update.__module__) Object.defineProperties(update, {
        __module__ : {value: null}
    });

    "77";
    while (true) {
        "78";
        (await rate(1e3));
        "79";
        if (cube.pos.x["<="](1["-u"]()["*"](L)["*"](.5)["+"](d["*"](.5))) && cube.v.x["<"](0) || cube.pos.x[">="](L["*"](.5)["-"](1["*"](d)["*"](.5))) && cube.v.x[">"](0)) {
            cube.v.x = 0;
        }
        "80";
        if (running) {
            update();
        }
        "81";
        if (re) {
            (await init());
        }
    }
};
if (!__main__.__module__) Object.defineProperties(__main__, {
    __module__ : {value: null}
});

;$(function(){ window.__context = { glowscript_container: $("#glowscript").removeAttr("id") }; __main__() })})()
// END JAVASCRIPT

//--><!]]></script>
</div>