Загрузка внешних библиотек javascript в блокноты jupyter - PullRequest
Новая
       6

Загрузка внешних библиотек javascript в блокноты jupyter

0 голосов
/ 16 ноября 2018

В настоящее время я пытаюсь загрузить внешнюю библиотеку JavaScript (https://github.com/enkimute/ganja.js) из блокнота jupyter и добавить элемент в блокнот, в котором я работаю

Вот суть минимального примера моего кода: https://gist.github.com/hugohadfield/7c42d6944b154ba8d73f07059964c730

%%javascript
require.config({paths: {ganja: 'https://unpkg.com/ganja.js@1.0.99/ganja'}});

console.log('Test1');

require(['ganja'],
    function(){                  
        Algebra(2,0,1,()=>{

            // We work in dual space so we define our points to be bivectors. Ganja.js overloads scientific notation to specify basis blades.
            // For readability we create a function that converts 2D euclidean coordinates to their 3D bivector representation.
            var point = (x,y)=>1e12-x*1e02+y*1e01;    

            // Similarly, we can define lines directly. The euclidean line ax + by + c can be specified so :
            var line = (a,b,c)=>a*1e1+b*1e2+c*1e0;

            // Define 3 points.
            var A=point(-1,1), B=point(-1,-1), C=point(1,-1); 

            // Define the line y=x-0.5
            var L=line(-1,1,0.5)

            // Or by joining two points. We define M as a function so it will update when C or A are dragged.
            var M=()=>C&A;

            // Points can also be found by intersecting two lines. We similarly define D as a function for interactive updates. 
            var D=()=>L^M;


            console.log('Test2');


            // We now use the graph function to create an SVG object that visualises our algebraic elements. The graph function accepts
            // an array of items that it will render in order. It can render points, lines, labels, colors, line segments and polygons.
            element.append(this.graph([
                A, "A",         // Render point A and label it.
                B, "B",         // Render point B and label it.
                C, "C",         // Render point C and label them.
                L, "L", M, "M", // Render and label lines.
                D, "D",         // Intersection point of L and M
                0xff0000,       // Set the color to red.
                [B,C],          // Render line segment from B to C. 
                0xffcccc,       // Set the color to light red.
                [A,B,C]         // render polygon ABC.
            ],{grid:true}));

        });

});

В записной книжке ничего не отображается, и я получаю код ошибки: ReferenceError: «Алгебра не определена»

Я думал, что require будет обрабатывать загрузку библиотеки, и поэтому я должен иметь возможность использовать алгебру, которая определена в этой библиотеке. Почему я не могу этого сделать, какова правильная форма для загрузки внешних библиотек в ноутбуки Jupyter?

1 Ответ

0 голосов
/ 12 декабря 2018

Исправлено, это было связано с именами объектов, которые экспортирует библиотека, и тем, как их требует загрузка, с фиксированным кодом: 

    %%javascript

require.config({paths: {Algebra: 'https://unpkg.com/ganja.js@1.0.99/ganja'}});
require(['Algebra'],function(Algebra){add_graph_to_notebook(Algebra)});

function add_graph_to_notebook(Algebra){
    var output = Algebra(2,0,1,()=>{

            // We work in dual space so we define our points to be bivectors. Ganja.js overloads scientific notation to specify basis blades.
            // For readability we create a function that converts 2D euclidean coordinates to their 3D bivector representation.
            var point = (x,y)=>1e12-x*1e02+y*1e01;    

            // Similarly, we can define lines directly. The euclidean line ax + by + c can be specified so :
            var line = (a,b,c)=>a*1e1+b*1e2+c*1e0;

            // Define 3 points.
            var A=point(-1,1), B=point(-1,-1), C=point(1,-1); 

            // Define the line y=x-0.5
            var L=line(-1,1,0.5)

            // Or by joining two points. We define M as a function so it will update when C or A are dragged.
            var M=()=>C&A;

            // Points can also be found by intersecting two lines. We similarly define D as a function for interactive updates. 
            var D=()=>L^M;

            // We now use the graph function to create an SVG object that visualises our algebraic elements. The graph function accepts
            // an array of items that it will render in order. It can render points, lines, labels, colors, line segments and polygons.
            return this.graph([
                A, 'A',         // Render point A and label it.
                B, 'B',         // Render point B and label it.
                C, 'C',         // Render point C and label them.
                L, 'L', M, 'M', // Render and label lines.
                D, 'D',         // Intersection point of L and M
                0xff0000,       // Set the color to red.
                [B,C],          // Render line segment from B to C. 
                0xffcccc,       // Set the color to light red.
                [A,B,C]         // render polygon ABC.
            ],{grid:true});

        });

    console.log(output);
    element.append(output)
}
...