{
"cells": [
{
"cell_type": "code",
"execution_count": 1,
"metadata": {},
"outputs": [
{
"data": {
"application/vnd.jupyter.widget-view+json": {
"model_id": "92c91f77-7bdc-4ed8-be5e-f114281fa4ab",
"version_major": 2,
"version_minor": 0
},
"method": "display_data"
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"def nodes = []\n",
"\n",
"for (x in (0..10)){\n",
" nodes.add(radius: x*5 + 5, colorB:(x*20))\n",
"}\n",
"\n",
"beakerx.testData = [nodes: nodes]"
]
},
{
"cell_type": "code",
"execution_count": 2,
"metadata": {},
"outputs": [
{
"data": {
"application/javascript": [
"require.config({\r\n",
" paths: {\r\n",
" d3: '//cdnjs.cloudflare.com/ajax/libs/d3/4.9.1/d3.min'\r\n",
" }});"
]
},
"execution_count": 2,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"%%javascript\n",
"require.config({\n",
" paths: {\n",
" d3: '//cdnjs.cloudflare.com/ajax/libs/d3/4.9.1/d3.min'\n",
" }});"
]
},
{
"cell_type": "code",
"execution_count": 3,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
""
]
},
"execution_count": 3,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"%%html\n",
""
]
},
{
"cell_type": "code",
"execution_count": 4,
"metadata": {},
"outputs": [
{
"data": {
"application/javascript": [
"\r\n",
"beakerx.displayHTML(this, '');\r\n",
"\r\n",
"var testData = beakerx.testData\r\n",
"\r\n",
"var d3 = require(['d3'], function (d3) {\r\n",
" \r\n",
" var width = 600,\r\n",
" height = 200;\r\n",
"\r\n",
" var svg = d3.select(\"#bkrx\")\r\n",
" .append(\"svg\")\r\n",
" .attr(\"width\", width)\r\n",
" .attr(\"height\", height)\r\n",
" .attr(\"transform\", \"translate(\"+[100, 0]+\")\");\r\n",
"\r\n",
" var node = svg.selectAll()\r\n",
" .data(testData.nodes)\r\n",
" .enter().append(\"circle\")\r\n",
" .attr(\"class\", \"moon\")\r\n",
" .attr(\"r\", function(d) { return d.radius; })\r\n",
" .attr(\"cx\", function(d, i) { return i*40 + d.radius; })\r\n",
" .attr(\"cy\", function(d, i) { return 50 + d.radius; })\r\n",
" .style(\"fill\", function(d) { return d3.rgb(100, 100 , d.colorB); }); \r\n",
"});"
]
},
"execution_count": 4,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"%%javascript\n",
"\n",
"beakerx.displayHTML(this, '');\n",
"\n",
"var testData = beakerx.testData\n",
"\n",
"var d3 = require(['d3'], function (d3) {\n",
" \n",
" var width = 600,\n",
" height = 200;\n",
"\n",
" var svg = d3.select(\"#bkrx\")\n",
" .append(\"svg\")\n",
" .attr(\"width\", width)\n",
" .attr(\"height\", height)\n",
" .attr(\"transform\", \"translate(\"+[100, 0]+\")\");\n",
"\n",
" var node = svg.selectAll()\n",
" .data(testData.nodes)\n",
" .enter().append(\"circle\")\n",
" .attr(\"class\", \"moon\")\n",
" .attr(\"r\", function(d) { return d.radius; })\n",
" .attr(\"cx\", function(d, i) { return i*40 + d.radius; })\n",
" .attr(\"cy\", function(d, i) { return 50 + d.radius; })\n",
" .style(\"fill\", function(d) { return d3.rgb(100, 100 , d.colorB); }); \n",
"});"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": []
}
],
"metadata": {
"kernelspec": {
"display_name": "Groovy",
"language": "groovy",
"name": "groovy"
},
"language_info": {
"codemirror_mode": "groovy",
"file_extension": ".groovy",
"mimetype": "",
"name": "Groovy",
"nbconverter_exporter": "",
"version": "2.4.3"
}
},
"nbformat": 4,
"nbformat_minor": 2
}