{
"cells": [
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### The `labelFormat` parameter in `geomText()`\n",
"\n",
"The `labelFormat` parameter specifies template for transforming value of the `label` aesthetic to a string.\n",
"\n",
"To learn more about formatting templates see: [Formatting](https://github.com/JetBrains/lets-plot-kotlin/blob/master/docs/formats.md)."
]
},
{
"cell_type": "code",
"execution_count": 1,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
" <div id=\"AW22Ca\"></div>\n",
" <script type=\"text/javascript\" data-lets-plot-script=\"library\">\n",
" if(!window.letsPlotCallQueue) {\n",
" window.letsPlotCallQueue = [];\n",
" }; \n",
" window.letsPlotCall = function(f) {\n",
" window.letsPlotCallQueue.push(f);\n",
" };\n",
" (function() {\n",
" var script = document.createElement(\"script\");\n",
" script.type = \"text/javascript\";\n",
" script.src = \"https://cdn.jsdelivr.net/gh/JetBrains/lets-plot@v4.0.0/js-package/distr/lets-plot.min.js\";\n",
" script.onload = function() {\n",
" window.letsPlotCall = function(f) {f();};\n",
" window.letsPlotCallQueue.forEach(function(f) {f();});\n",
" window.letsPlotCallQueue = [];\n",
" \n",
" \n",
" };\n",
" script.onerror = function(event) {\n",
" window.letsPlotCall = function(f) {};\n",
" window.letsPlotCallQueue = [];\n",
" var div = document.createElement(\"div\");\n",
" div.style.color = 'darkred';\n",
" div.textContent = 'Error loading Lets-Plot JS';\n",
" document.getElementById(\"AW22Ca\").appendChild(div);\n",
" };\n",
" var e = document.getElementById(\"AW22Ca\");\n",
" e.appendChild(script);\n",
" })();\n",
" </script>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"%useLatestDescriptors\n",
"%use lets-plot"
]
},
{
"cell_type": "code",
"execution_count": 2,
"metadata": {},
"outputs": [],
"source": [
"val df = mapOf<String, Any>(\n",
" \"y\" to (0 until 5),\n",
" \"z\" to listOf(1.0/3, 12.5/7, -22.5/11, 2.5/7, 31.67/1.77),\n",
" \"s\" to listOf(\"one\", \"two\", \"three\", \"four\", \"five\"))\n"
]
},
{
"cell_type": "code",
"execution_count": 3,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
" <div id=\"xEgdmv\"></div>\n",
" <script type=\"text/javascript\" data-lets-plot-script=\"plot\">\n",
" (function() {\n",
" var plotSpec={\n",
"\"mapping\":{\n",
"},\n",
"\"data\":{\n",
"\"y\":[0.0,1.0,2.0,3.0,4.0],\n",
"\"z\":[0.3333333333333333,1.7857142857142858,-2.0454545454545454,0.35714285714285715,17.89265536723164]\n",
"},\n",
"\"kind\":\"plot\",\n",
"\"scales\":[],\n",
"\"layers\":[{\n",
"\"mapping\":{\n",
"\"y\":\"y\",\n",
"\"label\":\"z\"\n",
"},\n",
"\"stat\":\"identity\",\n",
"\"position\":\"identity\",\n",
"\"geom\":\"text\",\n",
"\"data\":{\n",
"}\n",
"}]\n",
"};\n",
" var plotContainer = document.getElementById(\"xEgdmv\");\n",
" window.letsPlotCall(function() {{\n",
" LetsPlot.buildPlotFromProcessedSpecs(plotSpec, -1, -1, plotContainer);\n",
" }});\n",
" })(); \n",
" </script>"
]
},
"execution_count": 3,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"// Floating point numbers without formatting.\n",
"letsPlot(df) + geomText {y = \"y\"; label = \"z\"}"
]
},
{
"cell_type": "code",
"execution_count": 4,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
" <div id=\"bvuA2c\"></div>\n",
" <script type=\"text/javascript\" data-lets-plot-script=\"plot\">\n",
" (function() {\n",
" var plotSpec={\n",
"\"mapping\":{\n",
"},\n",
"\"data\":{\n",
"\"y\":[0.0,1.0,2.0,3.0,4.0],\n",
"\"z\":[0.3333333333333333,1.7857142857142858,-2.0454545454545454,0.35714285714285715,17.89265536723164]\n",
"},\n",
"\"kind\":\"plot\",\n",
"\"scales\":[],\n",
"\"layers\":[{\n",
"\"mapping\":{\n",
"\"y\":\"y\",\n",
"\"label\":\"z\"\n",
"},\n",
"\"stat\":\"identity\",\n",
"\"label_format\":\".3f\",\n",
"\"position\":\"identity\",\n",
"\"geom\":\"text\",\n",
"\"data\":{\n",
"}\n",
"}]\n",
"};\n",
" var plotContainer = document.getElementById(\"bvuA2c\");\n",
" window.letsPlotCall(function() {{\n",
" LetsPlot.buildPlotFromProcessedSpecs(plotSpec, -1, -1, plotContainer);\n",
" }});\n",
" })(); \n",
" </script>"
]
},
"execution_count": 4,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"// Floating point numbers with formatting.\n",
"letsPlot(df) + geomText(labelFormat = \".3f\") {y = \"y\"; label = \"z\"; }"
]
},
{
"cell_type": "code",
"execution_count": 5,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
" <div id=\"jefNV4\"></div>\n",
" <script type=\"text/javascript\" data-lets-plot-script=\"plot\">\n",
" (function() {\n",
" var plotSpec={\n",
"\"mapping\":{\n",
"},\n",
"\"data\":{\n",
"\"y\":[0.0,1.0,2.0,3.0,4.0],\n",
"\"z\":[0.3333333333333333,1.7857142857142858,-2.0454545454545454,0.35714285714285715,17.89265536723164]\n",
"},\n",
"\"kind\":\"plot\",\n",
"\"scales\":[],\n",
"\"layers\":[{\n",
"\"mapping\":{\n",
"\"y\":\"y\",\n",
"\"label\":\"z\"\n",
"},\n",
"\"stat\":\"identity\",\n",
"\"label_format\":\".1%\",\n",
"\"position\":\"identity\",\n",
"\"geom\":\"text\",\n",
"\"data\":{\n",
"}\n",
"}]\n",
"};\n",
" var plotContainer = document.getElementById(\"jefNV4\");\n",
" window.letsPlotCall(function() {{\n",
" LetsPlot.buildPlotFromProcessedSpecs(plotSpec, -1, -1, plotContainer);\n",
" }});\n",
" })(); \n",
" </script>"
]
},
"execution_count": 5,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"// Floating point numbers as percentage formatting.\n",
"letsPlot(df) + geomText(labelFormat = \".1%\") {y = \"y\"; label = \"z\"; }"
]
},
{
"cell_type": "code",
"execution_count": 6,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
" <div id=\"oTshNX\"></div>\n",
" <script type=\"text/javascript\" data-lets-plot-script=\"plot\">\n",
" (function() {\n",
" var plotSpec={\n",
"\"mapping\":{\n",
"},\n",
"\"data\":{\n",
"\"y\":[0.0,1.0,2.0,3.0,4.0],\n",
"\"z\":[0.3333333333333333,1.7857142857142858,-2.0454545454545454,0.35714285714285715,17.89265536723164]\n",
"},\n",
"\"kind\":\"plot\",\n",
"\"scales\":[],\n",
"\"layers\":[{\n",
"\"mapping\":{\n",
"\"y\":\"y\",\n",
"\"label\":\"z\"\n",
"},\n",
"\"stat\":\"identity\",\n",
"\"label_format\":\"Ttl: ${.2f} (B)\",\n",
"\"position\":\"identity\",\n",
"\"geom\":\"text\",\n",
"\"data\":{\n",
"}\n",
"}]\n",
"};\n",
" var plotContainer = document.getElementById(\"oTshNX\");\n",
" window.letsPlotCall(function() {{\n",
" LetsPlot.buildPlotFromProcessedSpecs(plotSpec, -1, -1, plotContainer);\n",
" }});\n",
" })(); \n",
" </script>"
]
},
"execution_count": 6,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"// Number format as a part of a string pattern.\n",
"letsPlot(df) + geomText(labelFormat = \"Ttl: \\${.2f} (B)\") {y = \"y\"; label = \"z\"; }"
]
},
{
"cell_type": "code",
"execution_count": 7,
"metadata": {},
"outputs": [
{
"data": {
"text/html": [
" <div id=\"MfXH7B\"></div>\n",
" <script type=\"text/javascript\" data-lets-plot-script=\"plot\">\n",
" (function() {\n",
" var plotSpec={\n",
"\"mapping\":{\n",
"},\n",
"\"data\":{\n",
"\"s\":[\"one\",\"two\",\"three\",\"four\",\"five\"],\n",
"\"y\":[0.0,1.0,2.0,3.0,4.0]\n",
"},\n",
"\"kind\":\"plot\",\n",
"\"scales\":[],\n",
"\"layers\":[{\n",
"\"mapping\":{\n",
"\"y\":\"y\",\n",
"\"label\":\"s\"\n",
"},\n",
"\"stat\":\"identity\",\n",
"\"label_format\":\"--{}--\",\n",
"\"position\":\"identity\",\n",
"\"geom\":\"text\",\n",
"\"data\":{\n",
"}\n",
"}]\n",
"};\n",
" var plotContainer = document.getElementById(\"MfXH7B\");\n",
" window.letsPlotCall(function() {{\n",
" LetsPlot.buildPlotFromProcessedSpecs(plotSpec, -1, -1, plotContainer);\n",
" }});\n",
" })(); \n",
" </script>"
]
},
"execution_count": 7,
"metadata": {},
"output_type": "execute_result"
}
],
"source": [
"// String pattern without value formatting. \"{}\"\n",
"letsPlot(df) + geomText(labelFormat = \"--{}--\") {y = \"y\"; label = \"s\"; }"
]
}
],
"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",
"nbconvert_exporter": "",
"pygments_lexer": "kotlin",
"version": "1.8.20"
}
},
"nbformat": 4,
"nbformat_minor": 2
}