Question

在我的Angular 6项目中使用npm install，我已经安装了以下软件包：https://www.npmjs.com/package/d3-timelines

问题是我不知道如何将其导入到Angular组件中。

我们确实还有其他d3进口商品，所以我只是在尝试使用这个特殊的包裹。

这就是我们拥有的：

import { Component, ViewEncapsulation, OnInit, AfterViewInit } from '@angular/core';

import * as d3 from 'd3-selection';
import * as d3Scale from 'd3-scale';
import * as d3Shape from 'd3-shape';
import * as d3Array from 'd3-array';
import * as d3Axis from 'd3-axis';
import * as d3TimeFormat from 'd3-time-format';
import * as d3Timeline from 'd3-timelines';
import { ViewChild } from '@angular/core';


@Component({
    selector: 'app-timeline',
    encapsulation: ViewEncapsulation.None,
    templateUrl: './timeline.component.html',
    styleUrls: ['./timeline.component.scss']
})
export class TimelineComponent implements AfterViewInit {

    title = 'Time Line';
    
    ngAfterViewInit() {    
       this.timelineCircle();
    }
    
      timelineCircle() {
        let width = 500; 
        var testData = [
            {times: [{"starting_time": 1355752800000, "ending_time": 1355759900000}, {"starting_time": 1355767900000, "ending_time": 1355774400000}]},
            {times: [{"starting_time": 1355759910000, "ending_time": 1355761900000}, ]},
            {times: [{"starting_time": 1355761910000, "ending_time": 1355763910000}]}
          ];
          var chart = d3Timeline.timeline();
      }

}

我得到的浏览器错误是：

 ERROR TypeError: d3_timelines__WEBPACK_IMPORTED_MODULE_6__.timeline is not a function

我只是不确定导入此软件包并在我的组件中使用它的正确方法。

建议受到赞赏...

Answer 1

您正在寻找的功能似乎是#ifndef READINFO_H #define READINFO_H #include <QThread> class Thread : public QThread { Q_OBJECT public: explicit Thread(QObject *parent =0); void print(QString in); void run(); signals: void print_line(QString x); }; #endif（复数）。您提供的代码段是timeline（）单数。

我还建议匹配模块导入中的复数：

d3Timeline.timelines()

我从软件包的examples文件夹中获得了函数的名称：请参见https://github.com/denisemauldin/d3-timeline/blob/master/examples/example.html中的第102行（以及其他内容）

希望在Angular 6中实现时间线包

1 个答案: