I have a similar issue to this post. Unfortunately the solution there has not worked for me. How can I use d3.hexbin inside a react component? I've included it in the dependencies and installed it.
"dependencies": {
"d3": "^7.3.0",
"d3-hexbin": "^0.2.2"
}
I imported d3 originally just like this:
import * as d3 from 'd3';
Other than hexbin I can use most modules and was able to do scatter and bar charts so far. I am fairly new to this, and am sorry if I'm missing something obvious, please let me know. Thanks!
If you're using Typescript, first make sure you have installed @types/d3-hexbin to your devDependencies.
Did you try:
import * as d3 from ‘d3-hexbin’
const hexbin = d3.hexbin
If you already have a d3 instance, you can rename the import like:
import * as d3Hexbin from 'd3-hexbin'
const {hexbin} = d3Hexbin
After importing the library, here is how to destructure and rename in one line:
const {hexbin: d3HB} = d3Hexbin
Here's a working sandbox