Graphileon Documentation
Graphileon.com
For Dashboard Designers Reference ImageMapView
Friday, August 8, 2025 7:56 AMImageMapView
Label: :IA_Function
Property: type: ImageMapView
Inherits from: Function and View
ImageMapView This functions displays an image with pre-defined clickable areas. The image can be panned and zoomed.
Function parameters
| Key | Description | Default value | Possible values |
|---|---|---|---|
source |
The source image URL | null |
string |
enableMapHighlights |
Enables maphilight on the image. For details, please check MapHilight | true |
boolean |
zoomToFit |
Enables the zoom-to-fit button on the image | false |
boolean |
enableWheelZoom |
Enables zooming with the mouse wheel | true |
boolean |
enablePan |
Enables panning | true |
boolean |
areas |
Array of areas for mapping | null |
array |
areaHighlights |
Style for the areas | {"stroke":false, "fillColor":"ff0000", "fillOpacity":0.6, "alwaysOn": true} |
object |
zoomScale |
Scale for zooming | 1.2 |
float |
minZoomScale |
Minimum zoom-out scale for the image | 0.3 |
float |
maxZoomScale |
Maximum zoom-in scale for the image | 3 |
float |
enableZoomButtons |
Enables zoom in and out buttons on the image | true |
boolean |
Outgoing triggers
Type: areaClicked
Occurrence: When the user clicks on a mapped area.
Additional event properties (besides the inherited properties):
| Key | Description | Possible values |
|---|---|---|
location |
Clicked latitude and longitude | Object with lat and lng value |
x |
Clicked screen X position | Number |
y |
Clicked screen Y position | Number |
Type: groupEnabled
Occurrence: When the user clicks on map.
Additional event properties (besides the inherited properties):
| Key | Description | Possible values |
|---|---|---|
location |
Clicked latitude and longtitude | Object with lat and lng value |
x |
Clicked screen X position | Number |
y |
Clicked screen Y position | Number |
Type: groupDisabled
Occurrence: When the user clicks on map.
Additional event properties (besides the inherited properties):
| Key | Description | Possible values |
|---|---|---|
location |
Clicked latitude and longtitude | Object with lat and lng value |
x |
Clicked screen X position | Number |
y |
Clicked screen Y position | Number |
Type: areaRightClicked
Occurrence: When the user clicks on map.
Additional event properties (besides the inherited properties):
| Key | Description | Possible values |
|---|---|---|
location |
Clicked latitude and longtitude | Object with lat and lng value |
x |
Clicked screen X position | Number |
y |
Clicked screen Y position | Number |
Type: imageClicked
Occurrence: When the user clicks on image.
Additional event properties (besides the inherited properties):
| Key | Description | Possible values |
|---|---|---|
location |
Clicked latitude and longtitude | Object with lat and lng value |
x |
Clicked screen X position | Number |
y |
Clicked screen Y position | Number |
Type: imageRightClicked
Occurrence: When the user right clicks on image.
Additional event properties (besides the inherited properties):
| Key | Description | Possible values |
|---|---|---|
location |
Clicked latitude and longtitude | Object with lat and lng value |
x |
Clicked screen X position | Number |
y |
Clicked screen Y position | Number |
Example configuration
ImageMapView function
{
"type": "ImageMapView",
"container.title": "ImageMapView (hover and click left or right on clickable areas)",
"enableMapHighlight": "true",
"enableWheelZoom": "true"
}
SHORTCUT from DASHBOARD to ImageMapView
{
"name": "Open Image Map View",
"#areas": "evaluate(\r\n[\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A-alt\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"170,115,6,75\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-0\",\r\n\t\tmapHighlighter: \"groupA\",\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Biomedical informatics\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"28,136,92,164\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-1\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Hypothesis generation\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"117,133,196,169\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-2\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Disease pathophysiology\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"243,134,338,168\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-3\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Therapeutic targets\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"360,137,422,169\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-4\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Data repository\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"27,219,92,248\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-5\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Cell lines\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"207,191,259,210\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-6\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Animal models\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"270,194,313,223\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-7\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Molecular pathway\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"361,194,422,225\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-8\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Genotypes\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"255,246,319,267\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-9\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Phenotypes\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"356,246,422,267\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-10\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"A. Biorepositories\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"11,276,110,303\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-11\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"A\"\r\n },\r\n\t\r\n\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"B\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"608,114,443,74\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-12\",\r\n\t\tmapHighlighter: \"groupB\",\r\n\t\tclass: \"B\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"B. Pharmacology & target engagement\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"468,120,574,153\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-13\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"B\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"B. Prognostive & predictive biomarker\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"446,215,516,260\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-14\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"B\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"B. Response biomarker\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"536,222,593,252\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-15\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"B\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"B. Qualification\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"484,284,556,301\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-16\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"B\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"B. Companion diagnostics\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"446,327,511,354\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-17\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"B\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"B. Surrogate endpoint\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"528,328,584,355\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-18\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"B\"\r\n },\r\n\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"C\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"814,114,691,74\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-19\",\r\n\t\tmapHighlighter: \"groupC\",\r\n\t\tclass: \"C\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"C. Assay development\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"637,123,730,164\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-20\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"C\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"C. HTS assay\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"755,131,808,153\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-21\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"C\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"C. Compound libraries\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"637,181,694,210\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-22\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"C\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"C. Chem-informatics\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"701,180,765,212\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-23\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"C\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"C. HTS system\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"657,246,797,274\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-24\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"C\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"C. Misses\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"631,306,673,323\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-25\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"C\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"C. Hits\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"776,307,805,322\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-26\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"C\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"C. Unapproved compounds (NCE/NME)\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"623,339,753,373\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-27\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"C\"\r\n },\r\n\t\r\n\t\r\n\t{\r\n \"target\": \"\",\r\n \"alt\": \"D\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"682,386,814,480\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-28\",\r\n\t\tmapHighlighter: \"groupD\",\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Lead compounds\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"598,440,676,468\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-29\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. In silico modeling\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"593,494,683,512\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-30\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Medical chemistry\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"608,547,667,577\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-31\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. In vitro functional & safety screening\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"705,547,803,579\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-32\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Process chemistry\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"607,606,668,634\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-33\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Non - GMP supply & early CMC\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"708,606,798,634\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-34\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Candidate compounds\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"617,660,742,680\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-35\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Investigative in vitro/in vivo safety & toxicology\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"557,716,677,761\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-36\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. In vitro/in vivo pharmacology\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"711,718,805,760\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-37\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Safety\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"561,790,616,813\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-38\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Effectiveness and POC\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"688,791,808,811\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-39\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Predicted therapeutic dose/exposure\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"581,835,779,856\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-40\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Shortlist for preclinical candidates\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"583,870,774,890\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-41\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Early cGMP manufacturing\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"605,907,749,924\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-42\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Pharmacokenetics\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"554,975,646,994\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-43\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Pharmacology\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"657,975,732,994\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-44\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Toxicology\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"740,975,802,994\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-45\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Long-term toxicology, reproductive toxicology, carcinogenesis\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"565,1046,692,1090\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-46\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Late CMC (e.g formulation)\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"575,1114,660,1142\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-47\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n },\r\n {\r\n \"target\": \"\",\r\n \"alt\": \"D. Sustained product availability\",\r\n \"title\": \"\",\r\n \"href\": \"\",\r\n \"coords\": \"798,1146,701,1117\",\r\n \"shape\": \"rect\",\r\n \"id\": \"area-48\",\r\n\t\tmapHighlighter: \"item\",\r\n\t\titem: true,\r\n\t\tclass: \"D\"\r\n }\r\n\t\r\n]\r\n)",
"$areaHighlights": "evaluate({\r\n\titem: {\r\n\t\tfillColor: \"ff00cc\",\r\n\t\tfillOpacity: 0.1,\r\n\t\tstroke: true,\r\n\t\tstrokeColor: \"00ff00\",\r\n\t\tstrokeWidth: 2,\r\n\t\tstrokeOpacity: 1,\r\n\t\talwaysOn: false\r\n\t},\r\n\tgroupA: {\r\n\t\tfillColor: \"ff00cc\",\r\n\t\tfillOpacity: 0.1,\r\n\t\tstroke: true,\r\n\t\tstrokeColor: \"00ff00\",\r\n\t\tstrokeWidth: 5,\r\n\t\tstrokeOpacity: 1,\r\n\t\talwaysOn: false,\r\n\t\tgroupBy: \".A\"\r\n\t},\r\n\tgroupB: {\r\n\t\tfillColor: \"ff00cc\",\r\n\t\tfillOpacity: 0.1,\r\n\t\tstroke: true,\r\n\t\tstrokeColor: \"00ff00\",\r\n\t\tstrokeWidth: 5,\r\n\t\tstrokeOpacity: 1,\r\n\t\talwaysOn: false,\r\n\t\tgroupBy: \".B\"\r\n\t},\r\n\tgroupC: {\r\n\t\tfillColor: \"ff00cc\",\r\n\t\tfillOpacity: 0.1,\r\n\t\tstroke: true,\r\n\t\tstrokeColor: \"00ff00\",\r\n\t\tstrokeWidth: 5,\r\n\t\tstrokeOpacity: 1,\r\n\t\talwaysOn: false,\r\n\t\tgroupBy: \".C\"\r\n\t},\r\n\tgroupD: {\r\n\t\tfillColor: \"ff00cc\",\r\n\t\tfillOpacity: 0.1,\r\n\t\tstroke: true,\r\n\t\tstrokeColor: \"00ff00\",\r\n\t\tstrokeWidth: 5,\r\n\t\tstrokeOpacity: 1,\r\n\t\talwaysOn: false,\r\n\t\tgroupBy: \".D\"\r\n\t},\r\n\tgreen: {\r\n\t\tstroke: false,\r\n\t\tfillColor: \"00ff00\",\r\n\t\tfillOpacity: 0.6,\r\n\t\talwaysOn: true\r\n\t}, \r\n\tred: {\r\n\t\tstroke: false,\r\n\t\tfillColor: \"ff0000\",\r\n\t\tfillOpacity: 0.6,\r\n\t\talwaysOn: true\r\n\t}, \r\n\tgroupABlue: {\r\n\t\tstroke: false,\r\n\t\tfillColor: \"0000ff\",\r\n\t\tfillOpacity:0.6,\r\n\t\talwaysOn: true,\r\n\t\tgroupBy: \".A\"\r\n\t}, \r\n\tgroupBBlue: {\r\n\t\tstroke: false,\r\n\t\tfillColor: \"0000ff\",\r\n\t\tfillOpacity: 0.2,\r\n\t\talwaysOn: true,\r\n\t\tgroupBy: \".B\"\r\n\t},\r\n\tgroupCBlue: {\r\n\t\tstroke: false,\r\n\t\tfillColor: \"0000ff\",\r\n\t\tfillOpacity: 0.2,\r\n\t\talwaysOn: true,\r\n\t\tgroupBy: \".C\"\r\n\t},\r\n\tgroupDBlue: {\r\n\t\tstroke: false,\r\n\t\tfillColor: \"0000ff\",\r\n\t\tfillOpacity: 0.2,\r\n\t\talwaysOn: true,\r\n\t\tgroupBy: \".D\"\r\n\t},\r\n\titemEnabled: {\r\n\t\tstroke: false,\r\n\t\tfillColor: \"0000ff\",\r\n\t\tfillOpacity: 0.4,\r\n\t\talwaysOn: true\r\n\t}\r\n})",
"$container.state": "maximized",
"$enableMapHighlight": "true",
"$enableZoomButtons": "true",
"$source": "https://ncats.nih.gov/sites/default/files/Figure%20A%20-%204DM%20Small%20Molecules%20Map.jpg"
}
TRIGGERs (self)
When group enabled updating the group areas
{
"type": "groupEnabled",
"#_update.change.areas": "evaluate(\r\n\tmap((%).data.groupAreas, x => extend(x, {mapHighlighter: x.item ? 'itemEnabled': 'group'+(%).data.area.class+'Blue'}))\r\n)",
"$_instance": "_previous"
}
When group disabled updating the group areas
{
"type": "groupDisabled",
"#_update.change.areas": "evaluate(\r\n\tmap((%).data.groupAreas, x => extend(x, {mapHighlighter: x.item ? 'item' : 'group' + (%).data.area.class}))\r\n)",
"$_instance": "_previous"
}
Adds context menu to area
{
"type": "context",
"#_update.change.areas": "evaluate([{\r\n id: (%).target.area.id,\r\n\t\t\tmapHighlighter: 'green'\r\n}])",
"$_instance": "_previous",
"action": "Make green",
"menu": "area"
}
Adds context menu to area
{
"type": "context",
"#_update.change.areas": "evaluate([{\r\n id: (%).target.area.id,\r\n\t\t\tmapHighlighter: 'red'\r\n}])",
"$_instance": "_previous",
"action": "Make red",
"menu": "area"
}
When area clicked change the highlighter
{
"type": "areaClicked",
"#_update.change.areas": "evaluate([\r\n\textend(\r\n\t\t(%).data.area, {mapHighlighter: (%).data.area.mapHighlighter === 'item' ? 'itemEnabled' : 'item'}\r\n\t)\r\n])",
"$_instance": "_previous",
"(%).data.isGroupSelector": "false"
}