Skip to content

Instantly share code, notes, and snippets.

@altavir
Created July 16, 2020 16:12
Show Gist options
  • Save altavir/55e88b7ca73f5df972bd0b808edb2724 to your computer and use it in GitHub Desktop.
Save altavir/55e88b7ca73f5df972bd0b808edb2724 to your computer and use it in GitHub Desktop.
plotlykt-jupyter-demo
{
"imports": [
"scientifik.plotly.*",
"scientifik.plotly.models.*",
"hep.dataforge.meta.*",
"kotlinx.html.*"
],
"repositories": [
"*mavenLocal",
"https://dl.bintray.com/mipt-npm/dataforge",
"https://dl.bintray.com/mipt-npm/scientifik",
"https://dl.bintray.com/mipt-npm/dev"
],
"init": [
"DISPLAY(HTML(PlotlyJupyter.initScript()))"
],
"renderers": {
"scientifik.plotly.Plot2D": "HTML(PlotlyJupyter.plotToHTML($it))",
"scientifik.plotly.PlotlyPage": "HTML(PlotlyJupyter.pageToHTML($it))"
},
"link": "https://github.com/mipt-npm/plotly.kt",
"properties": {
"v": "0.2.0-dev-8"
},
"dependencies": [
"scientifik:plotlykt-server:$v"
]
}
Display the source blob
Display the rendered blob
Raw
{
"cells": [
{
"cell_type": "code",
"execution_count": 6,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
"<div id=\"kotlinPlotly-init\">\n",
" <script>\n",
"if(typeof window.kotlinPlotly === 'undefined'){\n",
" let element = document.getElementById(\"kotlinPlotly-init\");\n",
" window.kotlinPlotly = new Promise((resolve, reject) => {\n",
" let script = document.createElement(\"script\");\n",
" script.type = \"text/javascript\";\n",
" script.src = \"C:/Users/darksnake/.jupyter_kotlin/assets/js/plotly.min.js\";\n",
" script.onload = function() {\n",
" resolve(script)\n",
" };\n",
" script.onerror = function(event) {\n",
" console.log(\"Error loading local Plotly JS from \"C:/Users/darksnake/.jupyter_kotlin/assets/js/plotly.min.js\", using CDN instead\")\n",
" let div = document.createElement(\"div\");\n",
" div.style.color = 'darkred';\n",
" div.textContent = 'Error loading local Plotly JS from C:/Users/darksnake/.jupyter_kotlin/assets/js/plotly.min.js, using CDN instead';\n",
" element.appendChild(div);\n",
" console.log(\"Loading plotly from CDN\")\n",
" let cdnScript = document.createElement(\"script\");\n",
" cdnScript.type = \"text/javascript\";\n",
" cdnScript.src = \"https://cdnjs.cloudflare.com/ajax/libs/plotly.js/1.54.6/plotly.min.js\";\n",
" cdnScript.onload = function() {\n",
" console.log(\"Successfully loaded Plotly from cdn\")\n",
" resolve(cdnScript)\n",
" };\n",
" cdnScript.onerror = function(event){\n",
" console.log(\"Failed to load Plotly from cdn\")\n",
" reject(\"Failed to load Plotly from cdn\")\n",
" }\n",
" element.appendChild(cdnScript);\n",
" };\n",
"\n",
" element.appendChild(script);\n",
" }); \n",
"}\n",
"</script>\n",
"</div>\n"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"%use plotly\n",
"import kotlin.math.*"
]
},
{
"cell_type": "code",
"execution_count": 5,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
"<div>\n",
" <div id=\"scientifik.plotly.Plot2D@78414208\">\n",
" <script defer=\"defer\">\n",
"Plotly.react(\n",
" 'scientifik.plotly.Plot2D@78414208',\n",
" [{\"x\":[0.0,0.01,0.02,0.03,0.04,0.05,0.06,0.07,0.08,0.09,0.1,0.11,0.12,0.13,0.14,0.15,0.16,0.17,0.18,0.19,0.2,0.21,0.22,0.23,0.24,0.25,0.26,0.27,0.28,0.29,0.3,0.31,0.32,0.33,0.34,0.35,0.36,0.37,0.38,0.39,0.4,0.41,0.42,0.43,0.44,0.45,0.46,0.47,0.48,0.49,0.5,0.51,0.52,0.53,0.54,0.55,0.56,0.57,0.58,0.59,0.6,0.61,0.62,0.63,0.64,0.65,0.66,0.67,0.68,0.69,0.7,0.71,0.72,0.73,0.74,0.75,0.76,0.77,0.78,0.79,0.8,0.81,0.82,0.83,0.84,0.85,0.86,0.87,0.88,0.89,0.9,0.91,0.92,0.93,0.94,0.95,0.96,0.97,0.98,0.99,1.0],\"name\":\"sin\",\"y\":[0.0,0.06279051952931337,0.12533323356430426,0.1873813145857246,0.2486898871648548,0.3090169943749474,0.3681245526846779,0.4257792915650727,0.4817536741017153,0.5358267949789967,0.5877852522924731,0.6374239897486896,0.6845471059286886,0.7289686274214116,0.7705132427757893,0.8090169943749475,0.8443279255020151,0.8763066800438637,0.9048270524660196,0.9297764858882513,0.9510565162951535,0.9685831611286311,0.9822872507286886,0.9921147013144779,0.9980267284282716,1.0,0.9980267284282716,0.9921147013144778,0.9822872507286886,0.9685831611286312,0.9510565162951536,0.9297764858882513,0.9048270524660195,0.8763066800438635,0.844327925502015,0.8090169943749475,0.7705132427757893,0.7289686274214114,0.6845471059286888,0.6374239897486899,0.5877852522924732,0.535826794978997,0.4817536741017156,0.4257792915650729,0.36812455268467814,0.3090169943749475,0.24868988716485482,0.18738131458572502,0.12533323356430454,0.06279051952931358,1.2246467991473532E-16,-0.06279051952931335,-0.12533323356430429,-0.18738131458572477,-0.24868988716485502,-0.30901699437494773,-0.3681245526846783,-0.42577929156507227,-0.481753674101715,-0.5358267949789964,-0.587785252292473,-0.6374239897486896,-0.6845471059286887,-0.7289686274214113,-0.7705132427757894,-0.8090169943749473,-0.8443279255020153,-0.8763066800438636,-0.9048270524660198,-0.9297764858882511,-0.9510565162951535,-0.968583161128631,-0.9822872507286887,-0.9921147013144778,-0.9980267284282716,-1.0,-0.9980267284282716,-0.9921147013144779,-0.9822872507286887,-0.9685831611286311,-0.9510565162951536,-0.9297764858882512,-0.9048270524660199,-0.8763066800438638,-0.8443279255020155,-0.8090169943749476,-0.7705132427757896,-0.7289686274214116,-0.684547105928689,-0.6374239897486896,-0.5877852522924734,-0.5358267949789963,-0.4817536741017153,-0.4257792915650722,-0.3681245526846787,-0.3090169943749476,-0.24868988716485535,-0.18738131458572468,-0.12533323356430465,-0.06279051952931326,-2.4492935982947064E-16]},{\"x\":[0.0,0.01,0.02,0.03,0.04,0.05,0.06,0.07,0.08,0.09,0.1,0.11,0.12,0.13,0.14,0.15,0.16,0.17,0.18,0.19,0.2,0.21,0.22,0.23,0.24,0.25,0.26,0.27,0.28,0.29,0.3,0.31,0.32,0.33,0.34,0.35,0.36,0.37,0.38,0.39,0.4,0.41,0.42,0.43,0.44,0.45,0.46,0.47,0.48,0.49,0.5,0.51,0.52,0.53,0.54,0.55,0.56,0.57,0.58,0.59,0.6,0.61,0.62,0.63,0.64,0.65,0.66,0.67,0.68,0.69,0.7,0.71,0.72,0.73,0.74,0.75,0.76,0.77,0.78,0.79,0.8,0.81,0.82,0.83,0.84,0.85,0.86,0.87,0.88,0.89,0.9,0.91,0.92,0.93,0.94,0.95,0.96,0.97,0.98,0.99,1.0],\"name\":\"cos\",\"y\":[1.0,0.9980267284282716,0.9921147013144779,0.9822872507286887,0.9685831611286311,0.9510565162951535,0.9297764858882515,0.9048270524660195,0.8763066800438636,0.8443279255020151,0.8090169943749475,0.7705132427757893,0.7289686274214116,0.6845471059286886,0.6374239897486896,0.5877852522924731,0.5358267949789965,0.48175367410171516,0.42577929156507266,0.3681245526846781,0.30901699437494745,0.24868988716485496,0.18738131458572474,0.12533323356430426,0.06279051952931353,6.123233995736766E-17,-0.0627905195293134,-0.12533323356430437,-0.18738131458572482,-0.24868988716485463,-0.30901699437494734,-0.368124552684678,-0.4257792915650727,-0.48175367410171543,-0.5358267949789969,-0.587785252292473,-0.6374239897486897,-0.6845471059286887,-0.7289686274214113,-0.7705132427757891,-0.8090169943749473,-0.8443279255020149,-0.8763066800438634,-0.9048270524660194,-0.9297764858882513,-0.9510565162951535,-0.9685831611286311,-0.9822872507286886,-0.9921147013144778,-0.9980267284282716,-1.0,-0.9980267284282716,-0.9921147013144779,-0.9822872507286886,-0.9685831611286311,-0.9510565162951535,-0.9297764858882512,-0.9048270524660197,-0.8763066800438637,-0.8443279255020152,-0.8090169943749476,-0.7705132427757893,-0.7289686274214116,-0.684547105928689,-0.6374239897486895,-0.5877852522924732,-0.5358267949789963,-0.48175367410171527,-0.42577929156507216,-0.3681245526846786,-0.30901699437494756,-0.2486898871648553,-0.18738131458572463,-0.1253332335643046,-0.06279051952931321,-1.8369701987210297E-16,0.06279051952931283,0.12533323356430423,0.18738131458572427,0.24868988716485493,0.30901699437494723,0.36812455268467825,0.4257792915650718,0.48175367410171493,0.535826794978996,0.5877852522924729,0.6374239897486893,0.6845471059286886,0.7289686274214112,0.7705132427757894,0.8090169943749473,0.8443279255020153,0.8763066800438636,0.9048270524660197,0.9297764858882511,0.9510565162951535,0.968583161128631,0.9822872507286887,0.9921147013144778,0.9980267284282716,1.0]}],\n",
" {\"xaxis\":{\"title\":\"x axis name\"},\"title\":\"The plot above\",\"yaxis\":{\"title\":\"y axis name\"}},\n",
" {}\n",
");\n",
"</script>\n",
" </div>\n",
" <hr>\n",
" <h1>A custom separator</h1>\n",
" <hr>\n",
" <div>\n",
" <div id=\"scientifik.plotly.Plot2D@4eebc5db\">\n",
" <script defer=\"defer\">\n",
"Plotly.react(\n",
" 'scientifik.plotly.Plot2D@4eebc5db',\n",
" [{\"x\":[0.0,0.01,0.02,0.03,0.04,0.05,0.06,0.07,0.08,0.09,0.1,0.11,0.12,0.13,0.14,0.15,0.16,0.17,0.18,0.19,0.2,0.21,0.22,0.23,0.24,0.25,0.26,0.27,0.28,0.29,0.3,0.31,0.32,0.33,0.34,0.35,0.36,0.37,0.38,0.39,0.4,0.41,0.42,0.43,0.44,0.45,0.46,0.47,0.48,0.49,0.5,0.51,0.52,0.53,0.54,0.55,0.56,0.57,0.58,0.59,0.6,0.61,0.62,0.63,0.64,0.65,0.66,0.67,0.68,0.69,0.7,0.71,0.72,0.73,0.74,0.75,0.76,0.77,0.78,0.79,0.8,0.81,0.82,0.83,0.84,0.85,0.86,0.87,0.88,0.89,0.9,0.91,0.92,0.93,0.94,0.95,0.96,0.97,0.98,0.99,1.0],\"name\":\"sin\",\"y\":[0.0,0.06279051952931337,0.12533323356430426,0.1873813145857246,0.2486898871648548,0.3090169943749474,0.3681245526846779,0.4257792915650727,0.4817536741017153,0.5358267949789967,0.5877852522924731,0.6374239897486896,0.6845471059286886,0.7289686274214116,0.7705132427757893,0.8090169943749475,0.8443279255020151,0.8763066800438637,0.9048270524660196,0.9297764858882513,0.9510565162951535,0.9685831611286311,0.9822872507286886,0.9921147013144779,0.9980267284282716,1.0,0.9980267284282716,0.9921147013144778,0.9822872507286886,0.9685831611286312,0.9510565162951536,0.9297764858882513,0.9048270524660195,0.8763066800438635,0.844327925502015,0.8090169943749475,0.7705132427757893,0.7289686274214114,0.6845471059286888,0.6374239897486899,0.5877852522924732,0.535826794978997,0.4817536741017156,0.4257792915650729,0.36812455268467814,0.3090169943749475,0.24868988716485482,0.18738131458572502,0.12533323356430454,0.06279051952931358,1.2246467991473532E-16,-0.06279051952931335,-0.12533323356430429,-0.18738131458572477,-0.24868988716485502,-0.30901699437494773,-0.3681245526846783,-0.42577929156507227,-0.481753674101715,-0.5358267949789964,-0.587785252292473,-0.6374239897486896,-0.6845471059286887,-0.7289686274214113,-0.7705132427757894,-0.8090169943749473,-0.8443279255020153,-0.8763066800438636,-0.9048270524660198,-0.9297764858882511,-0.9510565162951535,-0.968583161128631,-0.9822872507286887,-0.9921147013144778,-0.9980267284282716,-1.0,-0.9980267284282716,-0.9921147013144779,-0.9822872507286887,-0.9685831611286311,-0.9510565162951536,-0.9297764858882512,-0.9048270524660199,-0.8763066800438638,-0.8443279255020155,-0.8090169943749476,-0.7705132427757896,-0.7289686274214116,-0.684547105928689,-0.6374239897486896,-0.5877852522924734,-0.5358267949789963,-0.4817536741017153,-0.4257792915650722,-0.3681245526846787,-0.3090169943749476,-0.24868988716485535,-0.18738131458572468,-0.12533323356430465,-0.06279051952931326,-2.4492935982947064E-16]},{\"x\":[0.0,0.01,0.02,0.03,0.04,0.05,0.06,0.07,0.08,0.09,0.1,0.11,0.12,0.13,0.14,0.15,0.16,0.17,0.18,0.19,0.2,0.21,0.22,0.23,0.24,0.25,0.26,0.27,0.28,0.29,0.3,0.31,0.32,0.33,0.34,0.35,0.36,0.37,0.38,0.39,0.4,0.41,0.42,0.43,0.44,0.45,0.46,0.47,0.48,0.49,0.5,0.51,0.52,0.53,0.54,0.55,0.56,0.57,0.58,0.59,0.6,0.61,0.62,0.63,0.64,0.65,0.66,0.67,0.68,0.69,0.7,0.71,0.72,0.73,0.74,0.75,0.76,0.77,0.78,0.79,0.8,0.81,0.82,0.83,0.84,0.85,0.86,0.87,0.88,0.89,0.9,0.91,0.92,0.93,0.94,0.95,0.96,0.97,0.98,0.99,1.0],\"name\":\"cos\",\"y\":[1.0,0.9980267284282716,0.9921147013144779,0.9822872507286887,0.9685831611286311,0.9510565162951535,0.9297764858882515,0.9048270524660195,0.8763066800438636,0.8443279255020151,0.8090169943749475,0.7705132427757893,0.7289686274214116,0.6845471059286886,0.6374239897486896,0.5877852522924731,0.5358267949789965,0.48175367410171516,0.42577929156507266,0.3681245526846781,0.30901699437494745,0.24868988716485496,0.18738131458572474,0.12533323356430426,0.06279051952931353,6.123233995736766E-17,-0.0627905195293134,-0.12533323356430437,-0.18738131458572482,-0.24868988716485463,-0.30901699437494734,-0.368124552684678,-0.4257792915650727,-0.48175367410171543,-0.5358267949789969,-0.587785252292473,-0.6374239897486897,-0.6845471059286887,-0.7289686274214113,-0.7705132427757891,-0.8090169943749473,-0.8443279255020149,-0.8763066800438634,-0.9048270524660194,-0.9297764858882513,-0.9510565162951535,-0.9685831611286311,-0.9822872507286886,-0.9921147013144778,-0.9980267284282716,-1.0,-0.9980267284282716,-0.9921147013144779,-0.9822872507286886,-0.9685831611286311,-0.9510565162951535,-0.9297764858882512,-0.9048270524660197,-0.8763066800438637,-0.8443279255020152,-0.8090169943749476,-0.7705132427757893,-0.7289686274214116,-0.684547105928689,-0.6374239897486895,-0.5877852522924732,-0.5358267949789963,-0.48175367410171527,-0.42577929156507216,-0.3681245526846786,-0.30901699437494756,-0.2486898871648553,-0.18738131458572463,-0.1253332335643046,-0.06279051952931321,-1.8369701987210297E-16,0.06279051952931283,0.12533323356430423,0.18738131458572427,0.24868988716485493,0.30901699437494723,0.36812455268467825,0.4257792915650718,0.48175367410171493,0.535826794978996,0.5877852522924729,0.6374239897486893,0.6845471059286886,0.7289686274214112,0.7705132427757894,0.8090169943749473,0.8443279255020153,0.8763066800438636,0.9048270524660197,0.9297764858882511,0.9510565162951535,0.968583161128631,0.9822872507286887,0.9921147013144778,0.9980267284282716,1.0]}],\n",
" {\"xaxis\":{\"title\":\"x axis name\"},\"title\":\"The plot below\",\"yaxis\":{\"title\":\"y axis name\"}},\n",
" {}\n",
");\n",
"</script>\n",
" </div>\n",
" </div>\n",
"</div>\n"
]
},
"execution_count": 5,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"val x1 = (0..100).map { it.toDouble() / 100.0 }\n",
"val y1 = x1.map { sin(2.0 * PI * it) }\n",
"val y2 = x1.map { cos(2.0 * PI * it) }\n",
"\n",
"val trace1 = Trace(x1, y1) { name = \"sin\" }\n",
"val trace2 = Trace(x1, y2) { name = \"cos\" }\n",
"\n",
"Plotly.page { container ->\n",
" plot(handle = container) {\n",
" traces(trace1, trace2)\n",
" layout {\n",
" title = \"The plot above\"\n",
" xaxis.title = \"x axis name\"\n",
" yaxis.title = \"y axis name\"\n",
" }\n",
" }\n",
" hr()\n",
" h1 { +\"A custom separator\" }\n",
" hr()\n",
" div {\n",
" plot {\n",
" traces(trace1, trace2)\n",
" layout {\n",
" title = \"The plot below\"\n",
" xaxis.title = \"x axis name\"\n",
" yaxis.title = \"y axis name\"\n",
" }\n",
" }\n",
" }\n",
"}"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": []
}
],
"metadata": {
"kernelspec": {
"display_name": "Kotlin",
"language": "kotlin",
"name": "kotlin"
},
"language_info": {
"codemirror_mode": "text/x-kotlin",
"file_extension": ".kt",
"mimetype": "text/x-kotlin",
"name": "kotlin",
"pygments_lexer": "kotlin",
"version": "1.4.20-dev-1121"
}
},
"nbformat": 4,
"nbformat_minor": 4
}
@altavir
Copy link
Author

altavir commented Jul 16, 2020

plotly.json should be put into ~/.jupyter_kotlin/libraries/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment