Bokeh-JavaScript로 개발
Bokeh Python 라이브러리와 R, Scala 및 Julia와 같은 기타 언어 용 라이브러리는 주로 높은 수준에서 BokehJS와 상호 작용합니다. Python 프로그래머는 JavaScript 또는 웹 개발에 대해 걱정할 필요가 없습니다. 그러나 BokehJS API를 사용하여 BokehJS를 직접 사용하여 순수한 JavaScript 개발을 수행 할 수 있습니다.
글리프 및 위젯과 같은 BokehJS 객체는 Bokeh Python API에서와 비슷하게 빌드됩니다. 일반적으로 모든 Python ClassName은 다음과 같이 사용할 수 있습니다.Bokeh.ClassNameJavaScript에서. 예를 들어 Python에서 얻은 Range1d 개체입니다.
xrange = Range1d(start=-0.5, end=20.5)BokehJS를 사용하여 동등하게 획득됩니다.
var xrange = new Bokeh.Range1d({ start: -0.5, end: 20.5 });HTML 파일에 포함 된 경우 JavaScript 코드를 따라 가면 브라우저에서 간단한 선 플롯이 렌더링됩니다.
먼저 다음과 같이 웹 페이지의 <head> .. </ head> 섹션에 모든 BokehJS 라이브러리를 포함합니다.
<head>
<script type="text/javascript" src="https://cdn.pydata.org/bokeh/release/bokeh-1.3.4.min.js"></script>
<script type="text/javascript" src="https://cdn.pydata.org/bokeh/release/bokeh-widgets-1.3.4.min.js"></script>
<script type="text/javascript" src="https://cdn.pydata.org/bokeh/release/bokeh-tables-1.3.4.min.js"></script>
<script type="text/javascript" src="https://cdn.pydata.org/bokeh/release/bokeh-gl-1.3.4.min.js"></script>
<script type="text/javascript" src="https://cdn.pydata.org/bokeh/release/bokeh-api-1.3.4.min.js"></script>
<script type="text/javascript" src="https://cdn.pydata.org/bokeh/release/bokeh-api-1.3.4.min.js"></script>
</head>본문 섹션에서 JavaScript 스 니펫은 Bokeh 플롯의 다양한 부분을 구성합니다.
<script>
// create some data and a ColumnDataSource
var x = Bokeh.LinAlg.linspace(-0.5, 20.5, 10);
var y = x.map(function (v) { return v * 0.5 + 3.0; });
var source = new Bokeh.ColumnDataSource({ data: { x: x, y: y } });
// make the plot
var plot = new Bokeh.Plot({
title: "BokehJS Plot",
plot_width: 400,
plot_height: 400
});
// add axes to the plot
var xaxis = new Bokeh.LinearAxis({ axis_line_color: null });
var yaxis = new Bokeh.LinearAxis({ axis_line_color: null });
plot.add_layout(xaxis, "below");
plot.add_layout(yaxis, "left");
// add a Line glyph
var line = new Bokeh.Line({
x: { field: "x" },
y: { field: "y" },
line_color: "#666699",
line_width: 2
});
plot.add_glyph(line, source);
Bokeh.Plotting.show(plot);
</script>위 코드를 웹 페이지로 저장하고 원하는 브라우저에서 엽니 다.
