使用highcharts-export-server注入可變餅圖時出現問題

Question

我正在使用Highcharts Export Server作為Node.js模塊來生成PNG格式的圖表。 但是，當我包括可變半徑餅圖時，在生成的文件中出現錯誤。 錯誤是Highcharts錯誤＃17：

所請求的系列類型不存在。 當您將chart.type或series.type設置為Highcharts中未定義的系列類型時，會發生此錯誤。 一個典型的原因可能是您缺少定義系列類型的擴展文件，例如，要運行一個Arearange系列，您需要加載highcharts-more.js文件。

我使用的圖表是highcharts-more模塊的一部分，因此該錯誤是有道理的。 我什至找到了似乎能說明我解決方案的文檔。 Thre是resources選項，您可以在其中提供用於注入到導出的腳本。 該頁面在這里 ，但我將在下面包括以下重要內容：

-resources

{ 
    "files": "highstock.js,highcharts-more.js,data.js,drilldown.js,funnel.js,heatmap.js,treemap.js,highcharts-3d.js,no-data-to-display.js,map.js,solid-gauge.js,broken-axis.js", 
    "css": "g.highcharts-series path {stroke-width:2;stroke: pink}", 
    "js": "document.body.style.webkitTransform = \"rotate(-10deg)\";" 
}

• 文件：逗號分隔的文件名字符串，需要將其插入頁面以呈現圖表。 僅注入擴展名為.css和.js的文件，其余文件將被忽略。
• CSS：插入頁面主體中的CSS
• js：在頁面正文中插入的javascript

經過一些挖掘，我確實發現我可以將此資源選項作為JSON字符串對象傳遞到我的導出參數中。 因此，我嘗試注入highcharts-more.js的遠程版本。

 const exportImagesBase64 = async(data, format = 'png') => { HighchartsExport.initPool(); let resources = JSON.stringify({ files: "http://code.highcharts.com/highcharts-more.js" }); let charts = data.map(chart => exportPromise({ type: format, //png options: chart, //standard highcharts config object resources //resources option to inject highcharts-more })); charts = await Promise.all(charts); HighchartsExport.killPool(); return charts; }; const exportPromise = (data) => { return new Promise((resolve, reject) => { HighchartsExport.export(data, (err, res) => err ? reject(err) : resolve(res)); }); }; 

這是上面代碼中的data可能等於的示例

[{
    "chart": {
      "plotBackgroundColor": null,
      "plotBorderWidth": null,
      "plotShadow": false,
      "type": "variablepie",
      "height": 300,
      "width": 300
    },
    "title": {
      "text": "Placement Breakdown",
      "align": "left",
      "x": 30,
      "y": 30
    },
    "tooltip": {
      "headerFormat": "",
      "pointFormat": "<b> {point.name}</b><br/>Impressions: <b>{point.y}</b><br/>Clicks: <b>{point.z}</b><br/>"
    },
    "plotOptions": {
      "pie": {
        "allowPointSelect": true,
        "cursor": "pointer",
        "dataLabels": {
          "enabled": false
        },
        "showInLegend": true
      }
    },
    "series": [
      {
        "minPointSize": 10,
        "innerSize": "20%",
        "zMin": 0,
        "data": [
          {
            "name": "facebook",
            "y": 13642,
            "z": 357
          },
          {
            "name": "instagram",
            "y": 12920,
            "z": 326
          }
        ]
      }
    ],
    "credits": {
      "enabled": false
    }
  }]

由於添加了資源選項，我仍然收到＃17 Highcharts錯誤。 我在想這是完全錯誤的嗎？ 我找不到關於此的更多信息，所以我希望有人能分享一些知識。

Answer 1

可變餅圖類型的文檔要求參考highcharts-more.js 。

此圖表類型的實際需求似乎是modules/variable-pie.js 。 相反，使用此額外資源應該在導出時解決“請求的序列類型不存在”的問題。