document image format for tables

doc/groovy/TableAPI.ipynb

@@ -424,7 +424,7 @@
    "source": [
     "## HTML format\n",
     "\n",
-    "HTML format allows markup and styling of the cell's content.  Interactive JavaScript is not supported however."
+    "HTML format allows markup and styling of the cell's content.  Interactive JavaScript and images are not supported however.  See below for image support."
    ]
   },
   {
@@ -440,6 +440,52 @@
     "tbl"
    ]
   },
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "## Image format\n",
+    "\n",
+    "Image format allows loading any image supported by the web browser, including PNG, JPG, and SVG formats.  It can be a relative URL served from the same directories as the notebook itself, an absolute URL to anywhere on the web, or a data URL with encoded data."
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "tbl = new TableDisplay(['Peacock': '../resources/img/butterfly1.jpg',\n",
+    "                        'Morpho': '../resources/img/butterfly2.jpg',\n",
+    "                        'Swallowtail': '../resources/img/butterfly3.jpg']);\n",
+    "tbl.setStringFormatForColumn(\"Value\", TableDisplayStringFormat.getImageFormat())\n",
+    "tbl"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "tbl = new TableDisplay(['https://en.wikipedia.org/wiki/IPython': 'http://jupyter.org/assets/nav_logo.svg',\n",
+    "                        'https://en.wikipedia.org/wiki/Two_Sigma': 'https://upload.wikimedia.org/wikipedia/commons/thumb/5/54/2_sigma_logo.png/150px-2_sigma_logo.png']);\n",
+    "tbl.setStringFormatForColumn(\"Value\", TableDisplayStringFormat.getImageFormat())\n",
+    "tbl"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "tbl = new TableDisplay(['up': 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgaGVpZ2h0PSI2NCIgd2lkdGg9IjY0IiB2aWV3Qm94PSIwIDAgNjQgNjQiPg0KICA8cG9seWdvbiBmaWxsPSIjNmJhMmM3IiBwb2ludHM9IjMwLDQgNCw2MCA2MCw2MCI+PC9wb2x5Z29uPg0KPC9zdmc+DQo=',\n",
+    "                        'down': 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIGhlaWdodD0iNjQiIHdpZHRoPSI2NCIgdmlld0JveD0iMCAwIDY0IDY0Ij4KICA8cG9seWdvbiBmaWxsPSIjNmJhMmM3IiBwb2ludHM9IjMwLDYwIDYwLDQgNCw0Ij48L3BvbHlnb24+Cjwvc3ZnPgo=']);\n",
+    "tbl.setStringFormatForColumn(\"Value\", TableDisplayStringFormat.getImageFormat())\n",
+    "tbl"
+   ]
+  },
   {
    "cell_type": "markdown",
    "metadata": {},