Index.js:26 Uncaught ReferenceError: topojson is not defined

I am following the tutorial on creating a countries map. Ths is my first experience with maps in D3. I have added the topojson module in the index.html file as below.

   <script src="https://unpkg.com/browse/topojson@3.0.2/dist/topojson.min.js">

And I am trying to import “feature” from topojson as below in index.js.

import {
  select,
  json,
  geoPath,
  geoMercator,
} from 'd3';
import { feature } from 'topojson';

But topojson is not being defined. Here is a link to my work in vizhub. https://vizhub.com/rv-nath/c19e3bbba93749478a37a124a64748cb

Thanks for anyone helping me out on this. :pray:

Aha! Try chaging the URL of the script tag from

https://unpkg.com/browse/topojson@3.0.2/dist/topojson.min.js

(which is the UI browse view) to the following:

https://unpkg.com/topojson@3.0.2/dist/topojson.min.js

which is the raw JavaScript of the library. Good luck!

If that doesn’t work, maybe try using the package.json feature, which lets you specify which browser global to look for when using the import syntax for packages.

Works fine. Thank you. :pray:

1 Like