Skip to content

Instantly share code, notes, and snippets.

@ssugiyama
Last active June 12, 2017 13:20
Show Gist options
  • Save ssugiyama/29b586b25dc63730eb67ee6c1daefac8 to your computer and use it in GitHub Desktop.
Save ssugiyama/29b586b25dc63730eb67ee6c1daefac8 to your computer and use it in GitHub Desktop.
pythonとjsの連携
Display the source blob
Display the rendered blob
Raw
{
"cells": [
{
"cell_type": "code",
"execution_count": 1,
"metadata": {},
"outputs": [],
"source": [
"%load_ext py_d3"
]
},
{
"cell_type": "code",
"execution_count": 3,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
"\n",
"<script>\n",
"requirejs.config({\n",
" paths: {\n",
" d3: \"//cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3\"\n",
" }\n",
"});\n",
"\n",
"require(['d3'], function(d3) {\n",
" window.d3 = d3;\n",
"});\n",
"</script>\n",
"<script>\n",
"_select = d3.select;\n",
"\n",
"d3.select1 = function(selection) {\n",
" return _select(\"#d3-cell-1\").select(selection);\n",
"}\n",
"d3.selectAll1 = function(selection) {\n",
" return _select(\"#d3-cell-1\").selectAll(selection);\n",
"}\n",
"</script>\n",
"<g id=\"d3-cell-1\">\n",
"<script>\n",
"function pyexec(command) {\n",
" return new Promise(res => {\n",
" IPython.notebook.kernel.execute(command,\n",
" {iopub: {\n",
" output: \n",
" out => res(JSON.parse(eval(out.content.data[\"text/plain\"])))\n",
" }}, \n",
" {silent: false});\n",
" });\n",
"}\n",
"</script>\n",
"</g>"
],
"text/plain": [
"<IPython.core.display.HTML object>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"%%d3\n",
"<script>\n",
"function pyexec(command) {\n",
" return new Promise(res => {\n",
" IPython.notebook.kernel.execute(command,\n",
" {iopub: {\n",
" output: \n",
" out => res(JSON.parse(eval(out.content.data[\"text/plain\"])))\n",
" }}, \n",
" {silent: false});\n",
" });\n",
"}\n",
"</script>"
]
},
{
"cell_type": "code",
"execution_count": 4,
"metadata": {},
"outputs": [],
"source": [
"import json\n",
"import numpy as np\n",
"def get_data(count):\n",
" return json.dumps((np.random.rand(count)*10).tolist())"
]
},
{
"cell_type": "code",
"execution_count": 5,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
"\n",
"<script>\n",
"requirejs.config({\n",
" paths: {\n",
" d3: \"//cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3\"\n",
" }\n",
"});\n",
"\n",
"require(['d3'], function(d3) {\n",
" window.d3 = d3;\n",
"});\n",
"</script>\n",
"<script>\n",
"_select = d3.select;\n",
"\n",
"d3.select2 = function(selection) {\n",
" return _select(\"#d3-cell-2\").select(selection);\n",
"}\n",
"d3.selectAll2 = function(selection) {\n",
" return _select(\"#d3-cell-2\").selectAll(selection);\n",
"}\n",
"</script>\n",
"<g id=\"d3-cell-2\">\n",
"<g></g>\n",
"<style>\n",
"element {\n",
" height: 25px;\n",
"}\n",
"div.bar {\n",
" display: inline-block;\n",
" width: 20px;\n",
" height: 75px;\n",
" margin-right: 2px;\n",
" background-color: teal;\n",
"}\n",
"</style>\n",
"\n",
"<script>\n",
"pyexec(\"get_data(10)\")\n",
".then(dataset => {\n",
" d3.select2(\"g\").selectAll(\"div\")\n",
" .data(dataset)\n",
" .enter()\n",
" .append(\"div\")\n",
" .attr(\"class\", \"bar\")\n",
" .style(\"height\", d => {\n",
" let barHeight = d * 5;\n",
" return barHeight + \"px\";\n",
" });\n",
"});\n",
"\n",
"</script>\n",
"</g>"
],
"text/plain": [
"<IPython.core.display.HTML object>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"%%d3\n",
"<g></g>\n",
"<style>\n",
"element {\n",
" height: 25px;\n",
"}\n",
"div.bar {\n",
" display: inline-block;\n",
" width: 20px;\n",
" height: 75px;\n",
" margin-right: 2px;\n",
" background-color: teal;\n",
"}\n",
"</style>\n",
"\n",
"<script>\n",
"pyexec(\"get_data(10)\")\n",
".then(dataset => {\n",
" d3.select(\"g\").selectAll(\"div\")\n",
" .data(dataset)\n",
" .enter()\n",
" .append(\"div\")\n",
" .attr(\"class\", \"bar\")\n",
" .style(\"height\", d => {\n",
" let barHeight = d * 5;\n",
" return barHeight + \"px\";\n",
" });\n",
"});\n",
"\n",
"</script>\n"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"collapsed": true
},
"outputs": [],
"source": []
}
],
"metadata": {
"kernelspec": {
"display_name": "Python 3",
"language": "python",
"name": "python3"
},
"language_info": {
"codemirror_mode": {
"name": "ipython",
"version": 3
},
"file_extension": ".py",
"mimetype": "text/x-python",
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython3",
"version": "3.6.1"
}
},
"nbformat": 4,
"nbformat_minor": 2
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment