2

我正在使用最新的Backbone-boilerplate,它采用 ECMAScript 2015 作为默认语法。我计划在这个项目上使用HighChartsimport ,但遇到了 Highcharts 的问题。

我的实现如下。

Backbone.Viewhome.js(这是Backbone-boilerplate的默认索引)

import Component from '../../component';
import template from './home.html';
import Pitch from '../../modules/pitches/index';
import $ from 'jquery';
import highcharts from 'highcharts-release/highcharts';

// Import components.
import '../components/sample-component';

export default Component.extend({
    template,

    initialize: function () {
        this.template.registerPartial('nav', require('../partials/nav.html'));
        this.collection = new Pitch.Collection();
        this.collection.fetch({});
        this.listenTo(this.collection, 'reset sync', this.render);
    },

    afterRender: function () {
        $('#container').highcharts({
            chart: {
                type: 'scatter',
                zoomType: 'xy'
            },
            title: {
                text: 'Title'
            },
            subtitle: {
                text: 'Subtitle'
            }
        });
    }
});

我尝试了不同的组合来让它工作,但没有一个成功。

  • import highcharts from 'highcharts-release/highcharts'
  • import highcharts from 'highcharts'
  • import 'highcharts-release/highcharts'
  • import 'highcharts'

我收到这个错误,似乎 Highcharts 根本没有被导入。

未捕获的 TypeError: (0 , _jquery2.default)(...).highcharts 不是函数

以 ECMAScript 2015 方式导入 HighCharts 的正确方法是什么?

4

1 回答 1

1

我认为问题发生在 jQuery 上。按照使用 Highcharts 和 jQuery “有点”的说明解决了最初的问题。

import $ from 'jquery';
require('highcharts')($);

highcharts.js:315 Uncaught TypeError: c is not a function | highcharts.js:315除了控制台出现错误外,图形渲染得很好。有关更多信息,我目前正在使用 Highcharts 4.1.10。

更新:在Highcharts 4.2.0之后,以下内容有效。

import $ from 'jquery';
import Highcharts from 'highcharts';

...

let chart = new Highcharts.Chart();
于 2015-12-11T09:04:15.633 回答