flame chart

A flame chart shows hierarchical data with nested parent-child relationships.
The vertical axis shows the hierarchy depth, with parent items at the bottom and child items stacked on top.
The width of each block shows some value associated with it.

#' more examples:
#' https://github.com/helgasoft/echarty/blob/80dd3b9da655a42bcf1ec68a662eee530bcad286/demo/examples.R#L659

hc <- hclust(dist(USArrests), "ave")
cmax <- max(hc$height)
treeData <- ec.data(hc, format='dendrogram')[[1]]

fdat <- jsonlite::toJSON(treeData, force=TRUE, auto_unbox=TRUE, null='null')
vlvl <- 2  # min level for vertical labels (optional), set in jscode OR jsbtn
jscode <- paste0('window.flameData=',fdat,'; ')
jsbtn <- paste0("function(a) {
    if (typeof ec$vlevel == 'undefined') { window.ec$vlevel=",vlvl,";} else delete window.ec$vlevel;
    ch= ec_chart(echwid); ch.resize(); }")

ec.init(load= 'custom', title= list(text='flame tree', bottom='5%'),
  js= c(jscode, '',''),
  graphic= list(
    ec.util(cmd='button', text='\u00B1 vlevel2', right=11, top= 20, js=jsbtn)
  ),
  xAxis= list(show=F), yAxis= list(show=F),
  tooltip= list(formatter= ec.clmn('%@ %R2@',4,6)),
  series.param= list(
    type= 'custom', renderItem= "riFlame",   # JS function in renderers.js
    encode= list(x= c(1, 2, 3), y= 1),
    data= ec.data(treeData, format='flame')  # name='p22' is optional
  ),
  visualMap = list(
    type= 'continuous', max= cmax,
    inRange= list(color= c('#2F93C8', '#AEC48F', '#FFDB5C', '#F98862'))
  )
  ,on= list( list(event='click', handler='flameClick'))  # in renderers.js
)