javascriptモデルのbokehでエラーが発生しました

Question

Bokeh JSの実装、つまりbokehのJS APIを使用してグリフを表示しようとしています。私はbokehのドキュメントに記載されている指示に従ったが、ページエラーが出ている。たとえば、var plt = Bokehです。プロットは未定義です。何がうまくいかないの？

ドキュメントに示されているすべてのCSS/JSファイルが含まれています。以下はドキュメントからコピーされたコードです - それを稼働させようとしています

bokehjsを持つ人は助けになることができますか？

$(function() { 
 

 
    var plt = Bokeh.Plotting; 
 
    console.log(Bokeh.Plotting); 
 

 
    // set up some data 
 
    var M = 100; 
 
    var xx = []; 
 
    var yy = []; 
 
    var colors = []; 
 
    var radii = []; 
 
    for (var y = 0; y <= M; y += 4) { 
 
    for (var x = 0; x <= M; x += 4) { 
 
     xx.push(x); 
 
     yy.push(y); 
 
     colors.push(plt.color(50 + 2 * x, 30 + 2 * y, 150)); 
 
     radii.push(Math.random() * 0.4 + 1.7) 
 
    } 
 
    } 
 

 
    // create a data source 
 
    var source = new Bokeh.ColumnDataSource({ 
 
    data: { 
 
     x: xx, 
 
     y: yy, 
 
     radius: radii, 
 
     colors: colors 
 
    } 
 
    }); 
 

 
    // make the plot and add some tools 
 
    var tools = "pan,crosshair,wheel_zoom,box_zoom,reset,save"; 
 
    var p = plt.figure({ 
 
    title: "Colorful Scatter", 
 
    tools: tools 
 
    }); 
 

 
    // call the circle glyph method to add some circle glyphs 
 
    var circles = p.circle({ 
 
    field: "x" 
 
    }, { 
 
    field: "y" 
 
    }, { 
 
    source: source, 
 
    radius: radii, 
 
    fill_color: colors, 
 
    fill_alpha: 0.6, 
 
    line_color: null 
 
    }); 
 

 
    // add the plot to a document and display it 
 
    // var doc = new Bokeh.Document(); 
 
    // doc.add_root(plt); 
 
    // var div = $("#plot"); 
 
    // cosole.log(div); 
 
    // Bokeh.embed.add_document_standalone(doc, div); 
 

 
    plt.show(p); 
 

 

 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
<script src="https://cdn.pydata.org/bokeh/release/bokeh-0.12.4.min.js"></script> 
 
<script src="https://cdn.pydata.org/bokeh/release/bokeh-widgets-0.12.4.min.js"></script> 
 
<link rel="stylesheet" type="text/css" href="https://cdn.pydata.org/bokeh/release/bokeh-0.12.4.min.css"> 
 
<link rel="stylesheet" type="text/css" href="https://cdn.pydata.org/bokeh/release/bokeh-widgets-0.12.4.min.css"> 
 

 
<div id="plot"> 
 

 
</div>

Answer 1

ボケだから上記のコードは< = 0.12.1のためではなく、より多くの最近のリリースJSコードブレークのために働く0.12.1以降JS APIを変更されている、判明。しかし、ドキュメントは変更されていません。ドキュメントの更新はすぐに更新されます

Answer 2

最後に、私はBokehJS 0.12.4を動作させることができました。 release notes of 0.12.2には、BokehJS APIが独自のバンドルに分割されているという小さなメモが含まれています。事前0.12.2から新しいバージョンに移行するときに、既存のbokeh-0.12.4.min.jsとbokeh-widgets-0.12.4.min.jsに加えて、以下のjavascript

https://cdn.pydata.org/bokeh/release/bokeh-api-0.12.4.min.js 

を追加する必要があります。あなたの例にこのファイルを追加した後、それは動作します。残念ながら、この情報はまだBokehJSの公式文書には載っていません。

$(function() { 
 
    var plt = Bokeh.Plotting; 
 

 
    // set up some data 
 
    var M = 100; 
 
    var xx = []; 
 
    var yy = []; 
 
    var colors = []; 
 
    var radii = []; 
 
    for (var y = 0; y <= M; y += 4) { 
 
    for (var x = 0; x <= M; x += 4) { 
 
     xx.push(x); 
 
     yy.push(y); 
 
     colors.push(plt.color(50 + 2 * x, 30 + 2 * y, 150)); 
 
     radii.push(Math.random() * 0.4 + 1.7) 
 
    } 
 
    } 
 

 
    // create a data source 
 
    var source = new Bokeh.ColumnDataSource({ 
 
    data: { 
 
     x: xx, 
 
     y: yy, 
 
     radius: radii, 
 
     colors: colors 
 
    } 
 
    }); 
 

 
    // make the plot and add some tools 
 
    var tools = "pan,crosshair,wheel_zoom,box_zoom,reset,save"; 
 
    var p = plt.figure({ 
 
    title: "Colorful Scatter", 
 
    tools: tools 
 
    }); 
 

 
    // call the circle glyph method to add some circle glyphs 
 
    var circles = p.circle({ 
 
    field: "x" 
 
    }, { 
 
    field: "y" 
 
    }, { 
 
    source: source, 
 
    radius: radii, 
 
    fill_color: colors, 
 
    fill_alpha: 0.6, 
 
    line_color: null 
 
    }); 
 

 
    plt.show(p); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
<script src="https://cdn.pydata.org/bokeh/release/bokeh-0.12.4.min.js"></script> 
 
<script src="https://cdn.pydata.org/bokeh/release/bokeh-api-0.12.4.min.js"></script> 
 
<script src="https://cdn.pydata.org/bokeh/release/bokeh-widgets-0.12.4.min.js"></script> 
 
<link rel="stylesheet" type="text/css" href="https://cdn.pydata.org/bokeh/release/bokeh-0.12.4.min.css"> 
 
<link rel="stylesheet" type="text/css" href="https://cdn.pydata.org/bokeh/release/bokeh-widgets-0.12.4.min.css"> 
 

 
<div id="plot"></div>