在react JS组件文件中导入d3

Question

我使用了这篇文章的答案并做了import d3Js from 'https://d3js.org/d3.v3.min.js';但现在我收到了这个错误 -Failed to compile. ./src/components/StreamGraph.js Module not found: Can't resolve 'https://d3js.org/d3.v3.min.js' in 'C:\Users\...\src\components'

React 应用程序已通过 npm 安装了 v6，但我想导入 v3 以进行一些可视化。我正在尝试制作流图，但无法导入 d3 v3。

这是我需要运行的代码模板：

import React, { Component } from "react";
import d3Js from 'https://d3js.org/d3.v3.min.js';
// import * as d3 from 'd3';
import './StreamGraph.css';


class StreamGraph extends Component{

    // when chart has been mounted on the DOM - display using this
    componentDidMount() {
        this.drawChart();
    }

    drawChart() {
     // coded here
    }
    
    render(){
    return <div id={"#" + this.props.id}></div>
  }

}

export default StreamGraph;

我能知道是否可以导入另一个版本吗？

Answer 1

如果您使用 npm run npm install d3。如果您使用的是纱线运行yarn add d3。

然后你可以简单地使用 d3 函数，如下所示：

import * as d3 from 'd3'

d3.sum([1, 2, 3, -0.5])

或者

import { sum } from 'd3'

sum([1, 2, 3, -0.5])