Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

You can add a map to your dashboard, so that you can display regional data in a graphical form.

All you have to do is to create a Highmaps map widget and use it in your dashboard. The widget is defined by a calculation logic using the api.buildHighmap method. The data can come either from PriceAnalyzer or other storages or can be created on the fly.

Refer to the Highmaps API reference to explore the full variety of settings. At the very least you need to provide a chart.map value, series[n].joinBy value and series[n].data.

...

The following example is based on Color axis and data labels with a 1 to 1 translation from JavaScript (as found in "View Options" on the linked page) to Groovy:

Paste code macro
languagegroovy
titleColor Axis with DM Query
//======================================================
// to be adapted to your partition's Datamart definition
def DM_NAME = 'datamart_transaction'
def COUNTRY_FIELD = 'Country'
def REVENUE_FIELD = 'InvoicePrice'
def REGION_FIELD = 'Region'
//======================================================

def ctx = api.getDatamartContext()
def dm = ctx.getDatamart(DM_NAME)
def customQuery =
  ctx.newQuery(dm,true)
	.select(COUNTRY_FIELD, 'Country')
	.select('SUM('+REVENUE_FIELD+')', 'Revenue')
//	.where(REGION_FIELD + "='Europe'")
	.orderBy('Country')

def res = ctx.executeQuery(customQuery)?.getData()
def max = res.selectColumn('Revenue').max()?.getValue()?.toInteger()
def data = []

res.each  { row ->
  def country = row.get('Country')
  switch (country) {
    case 'UK': country = 'United Kingdom'
    break
    case 'USA': country = 'United States of America'
    break
  }
  def value = row.get('Revenue')
  if (value) {
    value = value.toInteger()
  }
  // by using the 'keys' option in series, we can
  // replace this commented out map by a simple array
  //data.push([ 'country' : country, 'value'   : value ])
  data.push([ country, value ])
}

api.trace('data', '', data)

def definition = [
  chart: [
    map: 'custom/europe',
    //map: 'custom/world',
    borderWidth: 1
  ],

  title: [
    text: 'Revenu by Country (EUR)'
  ],

  legend: [
    layout: 'horizontal',
    borderWidth: 0,
    backgroundColor: 'rgba(255,255,255,0.85)',
    floating: true,
    verticalAlign: 'top',
    y: 25
  ],

   mapNavigation: [
     enabled: true
   ],

   colorAxis: [
     type: 'linear',
     minColor: '#EEEEFF',
     maxColor: '#000022',
     stops: [
       [0, '#EFEFFF'],
       [0.67, '#4444FF'],
       [1, '#000022']
     ]
   ],

   series: [[
     animation: [ duration: 100 ],
     keys: ['country', 'value'], // see the above comment at data.push()
     joinBy: ['name', 'country'], // map key is 'name', data key is 'country'
     data: data,
     dataLabels: [
       enabled: true,
       color: '#FFFFFF',
       format: '{point.country}'
     ],
     name: 'Revenue',
     tooltip: [
       pointFormat: '{point.country}: {point.value} EUR'
     ]
  ]]
]

api.buildHighmap(definition)

...