VolkovLabs / business-charts

The Business Charts panel allows you to integrate charts and graphs created by the Apache ECharts library into your Grafana dashboard.
https://docs.volkovlabs.io
Apache License 2.0
139 stars 17 forks source link

Grafana 10.3.1 and Business 6.3.0 together cannot generate Map #340

Closed scs2007022 closed 1 month ago

scs2007022 commented 1 month ago

I simply copy the code in https://echarts.volkovlabs.io/d/X1mkMIFVz/geo-map?orgId=1&editPanel=11 in my grafana, but it does not work and having the following error:

TypeError: Cannot read properties of undefined (reading 'regions')
    at t.getInitialData (http://localhost:3000/public/plugins/volkovlabs-echarts-panel/module.js?_cache=6.3.0:128:1711727)
    at t.init (http://localhost:3000/public/plugins/volkovlabs-echarts-panel/module.js?_cache=6.3.0:128:765231)
    at t.eval (http://localhost:3000/public/plugins/volkovlabs-echarts-panel/module.js?_cache=6.3.0:128:720009)
    at Array.forEach (<anonymous>)
    at Wr (http://localhost:3000/public/plugins/volkovlabs-echarts-panel/module.js?_cache=6.3.0:128:545387)
    at t.eval (http://localhost:3000/public/plugins/volkovlabs-echarts-panel/module.js?_cache=6.3.0:128:719646)
    at e.topologicalTravel (http://localhost:3000/public/plugins/volkovlabs-echarts-panel/module.js?_cache=6.3.0:128:712963)
    at t._mergeOption (http://localhost:3000/public/plugins/volkovlabs-echarts-panel/module.js?_cache=6.3.0:128:719142)
    at am (http://localhost:3000/public/plugins/volkovlabs-echarts-panel/module.js?_cache=6.3.0:128:724316)
    at t._resetOption (http://localhost:3000/public/plugins/volkovlabs-echarts-panel/module.js?_cache=6.3.0:128:718407)

Besides, I tried to use

context.echarts.registerMap('myGeoJSON',{geoJSON:myGeoJSON});
return {
  series: [
    {
      type: 'map',
      map: 'world'
    }
  ]
}

where myGeoJSON is the raw string from https://geojson-maps.kyd.au/ I can see the preview of the map, but, it failed to save the panel and having the following message in log: grafana[97109]: client.go:264: RoundTripper returned a response & error; ignoring response

vitPinchuk commented 1 month ago

@scs2007022 Thank you for your question

Please, take a look at the documentation related to JSOM maps geojson

An example that suits you: dynamic-maps-loading

options: image

code to copy:

const json = context.panel.data.series[0].fields[0].values[0];

/**
 * Map Name
 */
const mapName = "World";

/**
 * Register map
 */
context.echarts.registerMap(mapName, { geoJSON: json });

/**
 * Return settiings
 */
return {
  title: {
    text: mapName,
    left: "right",
  },
  geo: {
    map: mapName,
    roam: true,
  },
};

data source I use that is business-input

Data source configuration: json from https://geojson-maps.kyd.au/

image

I run it on 10.3.1 and Business 6.3.0 The result is : image