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.

Drilldown not working with require or import (ES6)

See original GitHub issue

Hi!

First of all thanks for the great work on this lib, i really appreciate it! I have tried everything i can think of to make the drilldown work with a pie chart, but its not possible no mather how i try. Here is my code for the import section:

const Highcharts = require('highcharts')
const ReactHighcharts = require('react-highcharts')
const highchartsData = require('highcharts-data')

const higchartsDrilldown = require('highcharts-drilldown')

then later i try to

  class Chart extends Component {

  componentDidMount () {
    highchartsData(Highcharts)
    higchartsDrilldown(Highcharts)
  }

  componentWillUnmount () {
    this.chart.destroy()
  }

  render () {
    return (
      <div className='chart__chart-item'>
        <Highcharts config={this.props.config} callback={() => console.log('callback test from HChart')} />
      </div>
    )
  }
}

Chart.propTypes = {
  config: PropTypes.object.isRequired
}

export default Chart

The config is provided by a parent component and follows the standard structure from Highcharts website. I have a pie chart with som drilldowns. Does anyone know if this is a known bug?

Feel a bit weird that something as simple as importing a js lib has gotten harder to do with the new syntax(s), am i missing something obvious here?

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:9 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
Strateuscommented, Oct 24, 2017

For those who uses ReactHighcharts: HighchartsDrilldown(ReactHighcharts.Highcharts);

0reactions
kirjscommented, Nov 30, 2016

Thanks, make sense

Read more comments on GitHub >

github_iconTop Results From Across the Web

Highcharts drilldown not working when module is imported react
I am using ES6 and importing highcharts as import Highcharts from 'highcharts' where highcharts is a npm module mentioned in package.json. I ...
Read more >
Highcharts drilldown not working when module is imported ...
[Solved]-Highcharts drilldown not working when module is imported react-Reactjs ... import drilldown from 'highcharts-drilldown'; const Highchart = React.
Read more >
Installation with ES6 modules - Highcharts
Troubleshooting #. If your project fails because of missing Highcharts code, a compose call might be necessary after loading one of the module ......
Read more >
ECMAScript modules | Node.js v19.3.0 Documentation
Resolving relative specifiers does not work because data: is not a special ... require.cache is not used by import as the ES module...
Read more >
Hierarchy charts – amCharts 5 Documentation
Everything required to create hierarchy charts are two amCharts 5 modules: "index" and "hierarchy". You can import those in your TypeScript / ES6...
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