Comments (3)
Your description doesn't match your screenshot. Installing h3-js
using npm
and then running those functions works just fine:
Your screenshot shows stack traces from the output of Vue's runtime core, not h3-js
. You likely aren't require()
ing or import
ing the h3-js
module in the way Vue wants you to, but I am not familiar with Vue so I can't help you further on that without seeing the actual code you're trying to run, at least.
from h3-js.
This is my package.json File which had h3-js installed:
"scripts": {
"lint": "eslint --ext .js,.vue ./",
"format": "prettier --write "**/*.{js,vue,scss,html,md,json}" --ignore-path .gitignore",
"test": "echo "No test specified" && exit 0",
"dev": "quasar dev",
"build": "quasar build"
},
"dependencies": {
"@quasar/extras": "^1.16.4",
"geojson2h3": "^1.2.0",
"h3-js": "^3.6.1",
"quasar": "^2.6.0",
"vue": "^3.0.0",
"vue-router": "^4.0.0"
},
"devDependencies": {
"@quasar/app-vite": "^1.3.0",
"autoprefixer": "^10.4.2",
"eslint": "^8.10.0",
"eslint-config-prettier": "^8.1.0",
"eslint-plugin-vue": "^9.0.0",
"postcss": "^8.4.14",
"prettier": "^2.5.1"
},
"engines": {
"node": "^18 || ^16 || ^14.19",
"npm": ">= 6.13.4",
"yarn": ">= 1.21.1"
}
In my Vue File these are my imports I am able to see all console logs for geojson2h3 but for h3-js i am getting the attached console errors :
//geojson2h3
import geojson2h3 from "geojson2h3";
const polygon = {
type: "Feature",
geometry: {
type: "Polygon",
coordinates: [
[
[-122.47485823276713, 37.85878356045377],
[-122.47504834087829, 37.86196795698972],
[-122.47845104316997, 37.86010614563313],
[-122.47485823276713, 37.85878356045377],
],
],
},
};
const hexagons = geojson2h3.featureToH3Set(polygon, 10);
// -> ['8a2830855047fff', '8a2830855077fff', '8a283085505ffff', '8a283085506ffff']
console.log("hexagons", hexagons);
const feature = geojson2h3.h3SetToFeature(hexagons);
console.log("hexafeaturegons", feature);
//h3-js
//First way i tried
const h3 = require("h3-js");
console.log("h3 latLngToCell", h3);
const h3Index = h3.latLngToCell(37.3615593, -122.0553238, 7);
console.log("h3Index", h3Index);
//h3-js
//Second way
import { latLngToCell } from "h3-js";
console.log("h3 latLngToCell", latLngToCell);
//h3-js
//Third way
import latLngToCell from "h3-js";
console.log("h3 latLngToCell", latLngToCell);
I tried all the above three ways to import h3 in my vue file but getting the following errors as attached
from h3-js.
Oh, looking at that package.json
it becomes clear:
"h3-js": "^3.6.1",
That's v3.x for H3. Between v3 and v4 there was a major cleanup of function naming for better consistency (and error handling and other things we wanted to clean up). You're using the v4 naming eg latLngToCell
but the v3 version of h3-js follows the v3 naming eg geoToH3
.
My checks above assumed you were using the most recently-released version of h3-js.
So you can replace latLngToCell
with geoToH3
or you can upgrade h3-js
to the latest version (which will also get you new features, like vertex mode, and some minor perf bumps in most cases).
from h3-js.
Related Issues (20)
- Documentation of the [lat, lng] tuple HOT 4
- some h3index values create distorted long horizontal line on map HOT 1
- compactCells throws error HOT 1
- Openlayers instead of Mapbox HOT 1
- Count the number of points in the aggregated bins of H3-hexagons HOT 3
- Upgrade emscripten to 3.X.X? HOT 7
- Integrating with google maps HOT 1
- How to replace firestore geofire with h3? HOT 3
- Potential memory leak in polygonToCells HOT 10
- Load and Display H3-JS binned dataset in Mapbox HOT 1
- Consider buffer radius in addition to H3 resolution when counting points in the aggregated bins of H3-hexagons HOT 2
- Inverted coordinates HOT 1
- H3-JS binning resoluion in OpenLayers HOT 1
- Incorrect result from polygonToCells for bigger screen/ higher dimensions HOT 6
- Error when passing zero area polygon to h3.polygonToCells HOT 2
- Does h3-js send any data to the server? HOT 1
- H3 with dynamodb
- Different output from h3-js and postgis using cellToBoundary function HOT 1
- Hexagons Resolution HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from h3-js.