Prepare for Grafana 11

CHANGELOG.md

@@ -1,16 +1,32 @@
 # Change Log
 
-## 6.0.0 (2024-03-22)
+## 6.0.0 (2024-03-24)
 
 ### Breaking changes
 
 - Requires Grafana 10 and Grafana 11
+- Removed non-context code parameters. Please update parameters to use `context` in the Function.
+
+### Code parameters migration guide
+
+- data -> context.panel.data
+- theme -> context.grafana.theme
+- chart -> context.panel.chart
+- echarts -> context.echarts
+- ecStat -> context.ecStat
+- replaceVariables -> context.grafana.replaceVariables
+- eventBus -> context.grafana.eventBus
+- locationService -> context.grafana.locationService
+- notifySuccess -> context.grafana.notifySuccess
+- notifyError -> context.grafana.notifyError
 
 ### Features / Enhancements
 
 - Updated name to Business Charts Panel (#268)
 - Added Apache Acknowledgment and update description (#268)
 - Updated to Grafana 10.4.1 (#270)
+- Removed ArrayVector deprecated in Grafana 11 (#272)
+- Updated Apache ECharts deprecation warnings (#272)
 
 ## 5.3.0 (2024-03-06)
 

echarts.volkovlabs.io/graph.json

@@ -362,7 +362,7 @@
           "key": "",
           "plugin": "AMap.Scale,AMap.ToolBar"
         },
-        "getOption": "const values = [\n  {\n    fixed: true,\n    x: echartsInstance.getWidth() / 2,\n    y: echartsInstance.getHeight() / 2,\n    symbolSize: 20,\n    id: '-1'\n  }\n];\n\nconst edges = [];\n\noption = {\n  series: [\n    {\n      type: 'graph',\n      layout: 'force',\n      animation: false,\n      data: values,\n      force: {\n        // initLayout: 'circular'\n        // gravity: 0\n        repulsion: 100,\n        edgeLength: 5\n      },\n      edges: edges\n    }\n  ]\n};\n\nsetInterval(function () {\n  if (values.length > 50) {\n    return;\n  }\n\n  values.push({\n    id: values.length + ''\n  });\n  var source = Math.round((values.length - 1) * Math.random());\n  var target = Math.round((values.length - 1) * Math.random());\n  if (source !== target) {\n    edges.push({\n      source: source,\n      target: target\n    });\n  }\n  echartsInstance.setOption({\n    series: [\n      {\n        roam: true,\n        data: values,\n        edges: edges\n      }\n    ]\n  });\n}, 200);\n\nreturn option;",
+        "getOption": "const values = [\n  {\n    fixed: true,\n    x: context.panel.chart.getWidth() / 2,\n    y: context.panel.chart.getHeight() / 2,\n    symbolSize: 20,\n    id: '-1'\n  }\n];\n\nconst edges = [];\n\noption = {\n  series: [\n    {\n      type: 'graph',\n      layout: 'force',\n      animation: false,\n      data: values,\n      force: {\n        // initLayout: 'circular'\n        // gravity: 0\n        repulsion: 100,\n        edgeLength: 5\n      },\n      edges: edges\n    }\n  ]\n};\n\nsetInterval(function () {\n  if (values.length > 50) {\n    return;\n  }\n\n  values.push({\n    id: values.length + ''\n  });\n  var source = Math.round((values.length - 1) * Math.random());\n  var target = Math.round((values.length - 1) * Math.random());\n  if (source !== target) {\n    edges.push({\n      source: source,\n      target: target\n    });\n  }\n  context.panel.chart.setOption({\n    series: [\n      {\n        roam: true,\n        data: values,\n        edges: edges\n      }\n    ]\n  });\n}, 200);\n\nreturn option;",
         "google": {
           "callback": "gmapReady",
           "key": ""
@@ -473,7 +473,7 @@
           "key": "",
           "plugin": "AMap.Scale,AMap.ToolBar"
         },
-        "getOption": "const graphData = [\n  ['2017-02-01', 260],\n  ['2017-02-04', 200],\n  ['2017-02-09', 279],\n  ['2017-02-13', 847],\n  ['2017-02-18', 241],\n  ['2017-02-23', 411],\n  ['2017-03-14', 985]\n];\nconst links = graphData.map(function (item, idx) {\n  return {\n    source: idx,\n    target: idx + 1\n  };\n});\nlinks.pop();\nfunction getVirtualData(year) {\n  const date = +echarts.time.parse(year + '-01-01');\n  const end = +echarts.time.parse(+year + 1 + '-01-01');\n  const dayTime = 3600 * 24 * 1000;\n  const data = [];\n  for (let time = date; time < end; time += dayTime) {\n    data.push([\n      echarts.time.format(time, '{yyyy}-{MM}-{dd}', false),\n      Math.floor(Math.random() * 1000)\n    ]);\n  }\n  return data;\n}\n\nreturn {\n  tooltip: {},\n  calendar: {\n    top: 'middle',\n    left: 'center',\n    orient: 'vertical',\n    cellSize: 40,\n    yearLabel: {\n      margin: 50,\n      fontSize: 30\n    },\n    dayLabel: {\n      firstDay: 1,\n      nameMap: 'cn'\n    },\n    monthLabel: {\n      nameMap: 'cn',\n      margin: 15,\n      fontSize: 20,\n      color: '#999'\n    },\n    range: ['2017-02', '2017-03-31']\n  },\n  visualMap: {\n    min: 0,\n    max: 1000,\n    type: 'piecewise',\n    left: 'center',\n    bottom: 20,\n    inRange: {\n      color: ['#5291FF', '#C7DBFF']\n    },\n    seriesIndex: [1],\n    orient: 'horizontal'\n  },\n  series: [\n    {\n      type: 'graph',\n      edgeSymbol: ['none', 'arrow'],\n      coordinateSystem: 'calendar',\n      links: links,\n      symbolSize: 15,\n      calendarIndex: 0,\n      itemStyle: {\n        color: 'yellow',\n        shadowBlur: 9,\n        shadowOffsetX: 1.5,\n        shadowOffsetY: 3,\n        shadowColor: '#555'\n      },\n      lineStyle: {\n        color: '#D10E00',\n        width: 1,\n        opacity: 1\n      },\n      data: graphData,\n      z: 20\n    },\n    {\n      type: 'heatmap',\n      coordinateSystem: 'calendar',\n      data: getVirtualData('2017')\n    }\n  ]\n};",
+        "getOption": "const graphData = [\n  ['2017-02-01', 260],\n  ['2017-02-04', 200],\n  ['2017-02-09', 279],\n  ['2017-02-13', 847],\n  ['2017-02-18', 241],\n  ['2017-02-23', 411],\n  ['2017-03-14', 985]\n];\nconst links = graphData.map(function (item, idx) {\n  return {\n    source: idx,\n    target: idx + 1\n  };\n});\nlinks.pop();\nfunction getVirtualData(year) {\n  const date = +context.echarts.time.parse(year + '-01-01');\n  const end = +context.echarts.time.parse(+year + 1 + '-01-01');\n  const dayTime = 3600 * 24 * 1000;\n  const data = [];\n  for (let time = date; time < end; time += dayTime) {\n    data.push([\n      context.echarts.time.format(time, '{yyyy}-{MM}-{dd}', false),\n      Math.floor(Math.random() * 1000)\n    ]);\n  }\n  return data;\n}\n\nreturn {\n  tooltip: {},\n  calendar: {\n    top: 'middle',\n    left: 'center',\n    orient: 'vertical',\n    cellSize: 40,\n    yearLabel: {\n      margin: 50,\n      fontSize: 30\n    },\n    dayLabel: {\n      firstDay: 1,\n      nameMap: 'cn'\n    },\n    monthLabel: {\n      nameMap: 'cn',\n      margin: 15,\n      fontSize: 20,\n      color: '#999'\n    },\n    range: ['2017-02', '2017-03-31']\n  },\n  visualMap: {\n    min: 0,\n    max: 1000,\n    type: 'piecewise',\n    left: 'center',\n    bottom: 20,\n    inRange: {\n      color: ['#5291FF', '#C7DBFF']\n    },\n    seriesIndex: [1],\n    orient: 'horizontal'\n  },\n  series: [\n    {\n      type: 'graph',\n      edgeSymbol: ['none', 'arrow'],\n      coordinateSystem: 'calendar',\n      links: links,\n      symbolSize: 15,\n      calendarIndex: 0,\n      itemStyle: {\n        color: 'yellow',\n        shadowBlur: 9,\n        shadowOffsetX: 1.5,\n        shadowOffsetY: 3,\n        shadowColor: '#555'\n      },\n      lineStyle: {\n        color: '#D10E00',\n        width: 1,\n        opacity: 1\n      },\n      data: graphData,\n      z: 20\n    },\n    {\n      type: 'heatmap',\n      coordinateSystem: 'calendar',\n      data: getVirtualData('2017')\n    }\n  ]\n};",
         "google": {
           "callback": "gmapReady",
           "key": ""