question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How to import and instantiate a new circos in ES6?

See original GitHub issue

Hi @nicgirault, I couldn’t any information on README on how to use circosjs in ES6, so I tried this:

import React, { Component } from 'react';
import Circos from 'circos';

class Chart extends Component {
  render() {
    let myCircos = new Circos({
      container: '#lineChart',
      width: 500,
      height: 500,
    });
    return (
        <div id="lineChart"></div>
    );
  }
}

But I got this error:

TypeError: __WEBPACK_IMPORTED_MODULE_2_circos___default.a is not a constructor

I am very new to ES6 so please bear with me. Thank you very much, would appreciate any help.

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:9 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
nicgiraultcommented, Jul 22, 2017

This issue should be fixed by upgrading to circos 2.0.7 Can you reopen this issue if it’s not the case for you? Thanks

1reaction
nicgiraultcommented, Jul 22, 2017

@imranariffin thanks for reporting this issue. I think the problem comes from the webpack configuration that specify:

library: 'Circos',
libraryTarget: 'var'

I’ll try to fix this ASAP

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to import a module in es6 that itself needs to invoke ...
I'm wondering what if I have a factory function (inside of it I am not only instantiating the class but also doing some...
Read more >
Configuration and Installation - Tutorials - Circos
All of the tutorial configuration files will import global configuration files from etc/ , such as housekeeping.conf and colors_fonts_patterns.conf .
Read more >
ES6 Modules and How to Use Import and Export in JavaScript
The ES2015 (ES6) edition of the JavaScript standard gives us native support for modules with the import and export syntax.
Read more >
A Practical guide to ES6 modules - freeCodeCamp
In this article, we'll create a simple dashboard using ES6 modules, ... How ES6 modules work ( import vs export ); Let's build...
Read more >
Visualisation with Circos - Galaxy Training!
These always have at least three columns chromosome start end . Get data. Hands-on: Data upload. Create a new history for this tutorial....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found