Skip to content

Instantly share code, notes, and snippets.

@ghalter
Last active March 27, 2020 07:08
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ghalter/34e817685a132477a1f54029d942038f to your computer and use it in GitHub Desktop.
Save ghalter/34e817685a132477a1f54029d942038f to your computer and use it in GitHub Desktop.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Complete Example</title>
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-2.0.0.min.js"></script>
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-widgets-2.0.0.min.js"></script>
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-tables-2.0.0.min.js"></script>
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-gl-2.0.0.min.js"></script>
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-api-2.0.0.min.js"></script>
</head>
<body>
<script>
//The order of CSS and JS imports above is important.
</script>
<script>
// create a data source to hold data
var source = new Bokeh.ColumnDataSource({
data: { x: [10,15,31,3,21], y: [4,5,10,30,20] }
});
// make a plot with some tools
var plot = Bokeh.Plotting.figure({
title:'Example of Random data',
tools: "lasso_select, pan,wheel_zoom,box_zoom,reset,save",
height: 300,
width: 300
});
plot.circle({x: {field:'x'}, y:{field:'y'}, source:source})
source.selected.change.connect(function(a, selection){
console.log(selection.indices)
})
Bokeh.Plotting.show(plot);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment