We are reviewing Apache ECharts integration into Grafana.

We’ve managed to integrate most chart types, but we’re stuck with the ‘Treemap’.

We’ve seen examples like this: https://echarts.volkovlabs.io/d/FlnnZ4F4k/treemap?orgId=1&editPanel=6.

However, these rely mainly on static data, and we’re planning to use a JSON-API(https://packages.xxx.com/nodes.json) data source.

Given that Treemap requires hierarchical data, we’re struggling to integrate it using the JSON-API. We have a test API available at:

with script in grafana panel as below:

var thedata;

$.ajax({
  dataType: "json",
  url: 'https://packages.xxx.com/nodes.json',
  type: "GET",
  success: function (data1) {
    thedata = JSON.stringify(data1);
    alert(thedata);
  }
});


return {
  series: [{
    type: 'treemap',
    data: thedata
  }]
};

Could anyone provide guidance on how to bind a JSON-API data source to an Apache Treemap in Grafana, or offer a working sample? We’ve successfully connected the Treemap to static data but need help using dynamic data.