Question

我有以下jupyter笔记本单元格，在与笔记本相同的目录中的js文件夹中有fourd.js和r89dev.three.min.js：

%%html
<!doctype html>
<html>
    <head>
        <title>FourD.js Testbed</title>
        <script src="js/r89dev.three.min.js"></script>
        <script src="js/fourd.js"></script>
    </head>
    <body>
        <div id="display"></div>
        <script>
var CIRCLES = 100;
var CIRCLE_SIZE = 10;

fourd = new FourD();
fourd.init('#display', {width: 500, height: 350});
fourd._internals.camera.position.set(0, 0, -50);
var vertex1 = fourd.graph.add_vertex({size: 10, color: 0x000000});
var vertex2 = fourd.graph.add_vertex({size: 10, color: 0x000000});
var edge = fourd.graph.add_edge(vertex1, vertex2);

for(var i=0; i<CIRCLES; i++){
    vertex_options = [];
    for(var j=0; j<CIRCLE_SIZE; j++){
        vertex_options.push({size: 10, color: 0x000000});
    }

    fourd.graph.add_cycle(vertex_options);
}
        </script>
    </body>
</html>

我第一次尝试它时工作，但现在我得到一个错误，即没有定义三个。这意味着它正在加载fourd.js库，而不是three.js库。我能错过什么？

我直接在笔记本中得到的错误如下：

Javascript error adding output!
ReferenceError: THREE is not defined
See your browser Javascript console for more details.

但是我找不到关于javascript控制台中没有加载的三个j的相应错误消息。

Answer 1

TL; DR：从// three.js - http://github.com/mrdoob/three.js

的开头删除xxx.three.min.js条评论

我无法分辨它出错的地方，但您发现JavaScript strict mode序言和评论之间存在干扰。

如果您尝试以下单元格：

%%html
<div id="log"></div>
<script>
/* set a to a */
var a="a";$("#log").append("a is set to "+a+"<br>");
try{asdfg=1;}catch(x){$("#log").append(x+"<br>");}
</script>
<script>
"use strict";
/* set b to b */
var b="b";$("#log").append("b is set to "+b+"<br>");
try{bsdfg=1;}catch(x){$("#log").append(x+"<br>");}
</script>
<script>
/* set c to c */
"use strict";
var c="c";$("#log").append("c is set to "+c+"<br>");
try{csdfg=1;}catch(x){$("#log").append(x+"<br>");}
</script>
<script>
$("#log").append("Checking things:<br>");
try{$("#log").append("a is "+a+"<br>");}catch(x){$("#log").append("a is nope: "+x+"<br>");}
try{$("#log").append("b is "+b+"<br>");}catch(x){$("#log").append("b is nope: "+x+"<br>");}
try{$("#log").append("c is "+c+"<br>");}catch(x){$("#log").append("c is nope: "+x+"<br>");}
</script>

，它产生以下输出（使用Chrome，Firefox和IE测试）：

a is set to a
b is set to b
ReferenceError: bsdfg is not defined
c is set to c
ReferenceError: csdfg is not defined
Checking things:
a is a
b is b
c is nope: ReferenceError: c is not defined

＆＃34; x设置为x＆＃34;消息显示所有a-b-c块运行正常，中间的两个ReferenceErrors显示b和c都以严格模式运行，这也是预期的。
意想不到的是，c未设置在最后，产生第三个ReferenceError。

我无法解释这些评论对Jupyter的重要性，但他们确实如此。 three.min.js以注释行开头，然后它的行为类似于c，仍未定义。 fourd.js以"use strict";开头，开始评论仅在此之后出现，并且有效。

它似乎只是一个Jupyter的东西，因为即使嵌入在这里，下面的代码段工作正常：

＆＃13;

<script>
    /* set a to a */
    var a="a";
    console.log("a is set to "+a);
    try{asdfg=1;}catch(x){console.log(x);}
</script>
<script>
    "use strict";
    /* set b to b */
    var b="b";
    console.log("b is set to "+b);
    try{bsdfg=1;}catch(x){console.log(x);}
</script>
<script>
    /* set c to c */
    "use strict";
    var c="c";
    console.log("c is set to "+c);
    try{csdfg=1;}catch(x){console.log(x);}
</script>
<script>
    try{console.log(a);}catch(x){console.log(x);}
    try{console.log(b);}catch(x){console.log(x);}
    try{console.log(c);}catch(x){console.log(x);}
</script>

＆＃13;

（两个预期的ReferenceError-s显示为空{} - s，但它们在那里，并且所有a-b-c在末尾都设置正确）

Jupyter笔记本不包括THREE.js

1 个答案: