Fix bug causing data not to load

[ulfaslak]

Here's another one.

I'm getting Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0 in the browser console. Also the arrows do not render. Somehow, the data is not loading. This SO answer proposes the solution I suggest here.

Note: I don't fully understand why this happens and why this fix works. If you don't have the same problem on your local machine, maybe this is specific to my system (OSX 10.14.6), though I have tried in all browsers with same result.

[ilyabo]

Cool! I just pushed a different fix for the same issue

[ilyabo]

Can you try switching to the latest master on your machine?

[ulfaslak]

Sure, will try later today and report back!

BTW. Unrelated (I also asked Luciano, whom I presume you know, in a email thread), but do you have some boilerplate for using flowmap.gl without react?

[ilyabo]

Not at the moment. It should be possible though if you just use FlowMapLayer without the stuff from @flowmap.gl/react. Let me know how it goes if you try.

[ulfaslak]

Not at the moment. It should be possible though if you just use FlowMapLayer without the stuff from @flowmap.gl/react. Let me know how it goes if you try.

Will do!

Can you try switching to the latest master on your machine?

It totally works by the way. Thanks.

[ulfaslak]

Not at the moment. It should be possible though if you just use FlowMapLayer without the stuff from @flowmap.gl/react. Let me know how it goes if you try.

I've worked on it a bit, and I'm not really making much progress. I've been trying to use it with Svelte, but I'm not able to import it. After installing with npm and running I get this error upon import:

[!] Error: 'requireFromFile' is not exported by node-resolve:empty.js, imported by node_modules/@loaders.gl/loader-utils/dist/esm/lib/library-utils/library-utils.js
https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
node_modules/@loaders.gl/loader-utils/dist/esm/lib/library-utils/library-utils.js (4:9)
2: import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
3: import { global, isBrowser, isWorker } from '../env-utils/globals';
4: import { requireFromFile, requireFromString } from './require-utils.node';
            ^
5: import assert from '../env-utils/assert';
6: var LATEST = 'beta';
Error: 'requireFromFile' is not exported by node-resolve:empty.js, imported by node_modules/@loaders.gl/loader-utils/dist/esm/lib/library-utils/library-utils.js

I haven't spent more time trying to debug this.

What would be most helpful to me (and other data scientists who are not front end devs used to working in frameworks), was if there was a vanilla JS example. And even better, a standalone version that worked with standalone deck.gl! Then it would for example be usable on Observable! That would be awesome :).

And I just want to say, I really appreciate this software, and I can use it by hacking together some React app using this example, but if part of your target audience is mobility researchers, then a more framework-independent version is really needed.

[ilyabo]

Yes, a UMD build that could be used directly in the browser on in Observable would be definitely useful. I tried doing it some months ago, but there was a problem I think due to flowmap.gl depending on luma.gl while the UMD build of deck.gl contained but didn't expose luma.gl. Maybe this has changed, I will look into it. Created this issue: teralytics/flowmap.gl#93

[ilyabo]

Here's an example without React: https://github.com/ilyabo/flowmap.gl-purejs-example/
It does require Webpack though, so it won't work in Observable yet.