Reactjs fusioncharts react错误加载块失败 从“FusionCharts”导入FusionCharts； 从“fusioncharts/fusioncharts.charts”导入图表； 从“react fusioncharts”导入react fusioncharts； 从“React”导入React； //解决图表的依赖性 图表（FusionCharts）； 常量数据源={ 图表：{ 标题：“亚马逊优质视频分类”， 主题：“融合”， 视图模式：“1”， showrestorebtn:“0”， valuefontcolor:#FFFFFF“， yaxismaxvalue:“1000”， yaxisminvalue:“0”， divlinealpha：“0” }, 数据集：[ { 数据：[ { id:“01”， 标签：“主页”， x:“50”， y:“900”， 形状：“矩形”， 宽度：“80”， 身高：“40” }, { id:“02”， 标签：“电视节目”， x:“20”， y:“500”， 形状：“矩形”， 宽度：“80”， 身高：“40” }, { id:“02.1”， 标签：“Thriller”， x:“2”， y:“100”， 形状：“矩形”， 宽度：“60”， 身高：“40” }, { id:“02.2”， 标签：“戏剧”， x:“12”， y:“100”， 形状：“矩形”， 宽度：“60”， 身高：“40” }, { id:“02.3”， 标签：“喜剧”， x:“22”， y:“100”， 形状：“矩形”， 宽度：“60”， 身高：“40” }, { id:“03”， 标签：“电影”， x:“50”， y:“500”， 形状：“矩形”， 宽度：“80”， 身高：“40” }, { id:“03.1”， 标签：“戏剧”， x:“35”， y:“100”， 形状：“矩形”， 宽度：“60”， 身高：“40” }, { id:“03.2”， 标签：“行动”， x:“45”， y:“100”， 形状：“矩形”， 宽度：“60”， 身高：“40” }, { id:“03.3”， 标签：“恐怖”， x:“55”， y:“100”， 形状：“矩形”， 宽度：“60”， 身高：“40” }, { id:“03.5”， 标签：“Thriller”， x:“65”， y:“100”， 形状：“矩形”， 宽度：“60”， 身高：“40” }, { id:“04”， 标签：“儿童”， x:“80”， y:“500”， 形状：“矩形”， 宽度：“80”， 身高：“40” }, { id:“04.1”， 标签：“幻想”， x:“80”， y:“100”， 形状：“矩形”， 宽度：“60”， 身高：“40” }, { id:“04.2”， 标签：“动漫漫画”， x:“90”， y:“100”， 形状：“矩形”， 宽度：“60”， 身高：“40” } ] } ], 连接器：[ { 标准厚度：“1.5”， 连接器：[ { 从：“01”， 致：“03”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“01”， 致：“04”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“01”， 致：“02”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“01.02”， 致：“04”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“01.01”， 致：“02”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“02”， 致：“02.1”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“02”， 致：“02.2”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“02”， 致：“02.3”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“03”， 致：“03.1”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“03”， 致：“03.2”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“03”， 致：“03.3”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“03”， 致：“03.4”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“03”， 致：“03.5”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“03”， 致：“03.6”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“04”， 致：“04.1”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” }, { 从：“04”， 致：“04.2”， 箭头开始：“0”， 箭头结束：“1”， 阿尔法：“100” } ] } ] }; 导出默认类热图扩展React.Component{ render（）{ 返回( ); } }

这里我使用fusioncharts和react

但我的控制台中出现了以下错误

错误：

import FusionCharts from "fusioncharts";
import charts from "fusioncharts/fusioncharts.charts";
import ReactFusioncharts from "react-fusioncharts";
import React from 'react';


// Resolves charts dependancy
charts(FusionCharts);

const dataSource = {
  chart: {
    caption: "Amazon Prime Video Categorization",
    theme: "fusion",
    viewmode: "1",
    showrestorebtn: "0",
    valuefontcolor: "#FFFFFF",
    yaxismaxvalue: "1000",
    yaxisminvalue: "0",
    divlinealpha: "0"
  },
  dataset: [
    {
      data: [
        {
          id: "01",
          label: "Home",
          x: "50",
          y: "900",
          shape: "rectangle",
          width: "80",
          height: "40"
        },
        {
          id: "02",
          label: "TV Shows",
          x: "20",
          y: "500",
          shape: "rectangle",
          width: "80",
          height: "40"
        },
        {
          id: "02.1",
          label: "Thriller",
          x: "2",
          y: "100",
          shape: "rectangle",
          width: "60",
          height: "40"
        },
        {
          id: "02.2",
          label: "Drama",
          x: "12",
          y: "100",
          shape: "rectangle",
          width: "60",
          height: "40"
        },
        {
          id: "02.3",
          label: "Comedy",
          x: "22",
          y: "100",
          shape: "rectangle",
          width: "60",
          height: "40"
        },
        {
          id: "03",
          label: "Movies",
          x: "50",
          y: "500",
          shape: "rectangle",
          width: "80",
          height: "40"
        },
        {
          id: "03.1",
          label: "Drama",
          x: "35",
          y: "100",
          shape: "rectangle",
          width: "60",
          height: "40"
        },
        {
          id: "03.2",
          label: "Action",
          x: "45",
          y: "100",
          shape: "rectangle",
          width: "60",
          height: "40"
        },
        {
          id: "03.3",
          label: "Horror",
          x: "55",
          y: "100",
          shape: "rectangle",
          width: "60",
          height: "40"
        },
        {
          id: "03.5",
          label: "Thriller",
          x: "65",
          y: "100",
          shape: "rectangle",
          width: "60",
          height: "40"
        },
        {
          id: "04",
          label: "Kids",
          x: "80",
          y: "500",
          shape: "rectangle",
          width: "80",
          height: "40"
        },
        {
          id: "04.1",
          label: "Fantasy",
          x: "80",
          y: "100",
          shape: "rectangle",
          width: "60",
          height: "40"
        },
        {
          id: "04.2",
          label: "Anime Cartoons",
          x: "90",
          y: "100",
          shape: "rectangle",
          width: "60",
          height: "40"
        }
      ]
    }
  ],
  connectors: [
    {
      stdthickness: "1.5",
      connector: [
        {
          from: "01",
          to: "03",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "01",
          to: "04",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "01",
          to: "02",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "01.02",
          to: "04",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "01.01",
          to: "02",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "02",
          to: "02.1",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "02",
          to: "02.2",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "02",
          to: "02.3",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "03",
          to: "03.1",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "03",
          to: "03.2",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "03",
          to: "03.3",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "03",
          to: "03.4",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "03",
          to: "03.5",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "03",
          to: "03.6",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "04",
          to: "04.1",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        },
        {
          from: "04",
          to: "04.2",
          arrowatstart: "0",
          arrowatend: "1",
          alpha: "100"
        }
      ]
    }
  ]
};

export default class HeatMap extends React.Component {
  render() {
    return (
      <ReactFusioncharts
        type="dragnode"
        width="100%"
        height="100%"
        dataFormat="JSON"
        dataSource={dataSource}
      />
    );
  }
}

未捕获的语法错误：意外标记<
js:2202未捕获（承诺中）错误：错误：加载区块4失败。
（缺失：http://localhost:3000/fusioncharts.powercharts.js)
在HTMLScriptElement.a（fusioncharts.js:103）
在fusioncharts.js:2202

我需要为此单独安装powercharts或treemaps吗

请看一看

我和fusio核实过了

Uncaught SyntaxError: Unexpected token <
fusioncharts.js:2202 Uncaught (in promise) Error: Error: Loading chunk 4 failed.
(missing: http://localhost:3000/fusioncharts.powercharts.js)
    at HTMLScriptElement.a (fusioncharts.js:103)
    at fusioncharts.js:2202

import FusionCharts from 'fusioncharts';
import PowerCharts from 'fusioncharts/fusioncharts.powercharts';
import FusionTheme from 'fusioncharts/themes/fusioncharts.theme.fusion';
import ReactFC from 'react-fusioncharts';

ReactFC.fcRoot(FusionCharts, PowerCharts, FusionTheme);

import FusionCharts from 'fusioncharts';
import PowerCharts from 'fusioncharts/fusioncharts.powercharts';
import TreeMap from 'fusioncharts/fusioncharts.treemap';
import FusionTheme from 'fusioncharts/themes/fusioncharts.theme.fusion';
import ReactFC from 'react-fusioncharts';

ReactFC.fcRoot(FusionCharts, PowerCharts ,TreeMap,FusionTheme);