Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

JavaScript Maps are super underrated. Keys of a map can be anything - including an object! Here I'm using the new groupBy proposed API to group array items into a Map or an Object →

wesbos's profile picture

Wes Bos

437,608 subscribers

240,399 görüntüleme • 3 yıl önce •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

11 Yorum

Nick Taylor profil fotoğrafı
Nick Taylor3 yıl önce

WeakMaps ftw as well!

Wes Bos profil fotoğrafı
Wes Bos3 yıl önce

Nothing better than something that cleans up

Paulo Reis profil fotoğrafı
Paulo Reis3 yıl önce

I've been using the JavaScript Maps a lot, thanks for the teachings 💯

Wes Bos profil fotoğrafı
Wes Bos3 yıl önce

big fan!

zayenz 🐀 profil fotoğrafı
zayenz 🐀3 yıl önce

Maps are great, but I really miss structural equality for the keys when they are objects, as that is so much more useful. Especially if the key is computed at lookup.

Wes Bos profil fotoğrafı
Wes Bos3 yıl önce

I agree, I wonder if we will ever get that in JS

Web-Dev-Codi profil fotoğrafı
Web-Dev-Codi3 yıl önce

YT comment: You should use a for loop for performance. Wes: I'm iterating over 3 things brotha. 🤣 This was hilarious

vovô ermitão profil fotoğrafı
vovô ermitão3 yıl önce

except that it lacks a hashing function hook

Wes Bos profil fotoğrafı
Wes Bos3 yıl önce

@crudspecialist What would we use that for? Not snark, curious!

Rocky profil fotoğrafı
Rocky3 yıl önce

@wesbos where can we find this video or podcasts ? Really interested in it

Wes Bos profil fotoğrafı
Wes Bos3 yıl önce

This is it - I made it for twitter

Benzer Videolar

The Abandoned Mall DLC is here, bringing you a new map and 38 items for the object dropper! Time to level up your tricks on XBOX and dominate the Mall! 📷
1:17

The Abandoned Mall DLC is here, bringing you a new map and 38 items for the object dropper! Time to level up your tricks on XBOX and dominate the Mall! 📷

Session: Skate Sim

25,314 görüntüleme • 2 yıl önce

A living man can be enslaved and reduced to the historic condition of an object. But if he dies in refusing to be enslaved, he reaffirms the existence of another kind of human nature which refuses to be classified as an object. Albert Camus
0:31

A living man can be enslaved and reduced to the historic condition of an object. But if he dies in refusing to be enslaved, he reaffirms the existence of another kind of human nature which refuses to be classified as an object. Albert Camus

Charlie Veitch

336,674 görüntüleme • 11 ay önce

Control and render on the map in three dimensions with the power of WebGL and the Maps JavaScript API. ✨ ✈️ Check out this demo to see plans for a trip to London, including the flight, transportation, stay, and attractions, all in one interactive setting ➡️
0:34

Control and render on the map in three dimensions with the power of WebGL and the Maps JavaScript API. ✨ ✈️ Check out this demo to see plans for a trip to London, including the flight, transportation, stay, and attractions, all in one interactive setting ➡️

Google Maps Platform

71,349 görüntüleme • 5 ay önce

FFXIV players, Stream Deck might be your BiS. Map gear sets to dedicated keys, keep actions and items within reach, and pull up your map and menus in an instant. Which one are you setting up first? 👇
0:37

FFXIV players, Stream Deck might be your BiS. Map gear sets to dedicated keys, keep actions and items within reach, and pull up your map and menus in an instant. Which one are you setting up first? 👇

Elgato

468,597 görüntüleme • 3 ay önce

#WATCH | Delhi: On Israel authorities using an incorrect map of India, Israeli Ambassador to India, Reuven Azar, says "...I hope that this phenomenon won't continue, but it doesn't have anything to do with what we think about India's borders...Different authorities are releasing maps from time to time, and these maps are not accurate. We're making an effort now, we have asked all the agencies to stop using bad maps..."
0:27

#WATCH | Delhi: On Israel authorities using an incorrect map of India, Israeli Ambassador to India, Reuven Azar, says "...I hope that this phenomenon won't continue, but it doesn't have anything to do with what we think about India's borders...Different authorities are releasing maps from time to time, and these maps are not accurate. We're making an effort now, we have asked all the agencies to stop using bad maps..."

ANI

66,575 görüntüleme • 1 yıl önce

As a bit of an extra feature, we've added support for the additional buttons on the New Nintendo 3DS! Shown here, the C-Stick can be used to look around on the world map. Other additional bonus features are planned.
0:43

As a bit of an extra feature, we've added support for the additional buttons on the New Nintendo 3DS! Shown here, the C-Stick can be used to look around on the world map. Other additional bonus features are planned.

Super Mario Bros. Next

93,865 görüntüleme • 1 yıl önce

Few people realise the scale of the Himalayas because static maps are a bad way to convey topography. Fortunately, we can use interactive maps to explore topography. Here is an example using Pyvista.
0:38

Few people realise the scale of the Himalayas because static maps are a bad way to convey topography. Fortunately, we can use interactive maps to explore topography. Here is an example using Pyvista.

Python Maps

691,638 görüntüleme • 1 yıl önce

AOC: All those maps were passed by the state legislatures. Virginia was an election of three million Americans. This court did not overturn a map, it overturned an election. It’s one thing for a court to check a legislature or an executive but the end-all and be-all of power in America should be the people.
2:18

AOC: All those maps were passed by the state legislatures. Virginia was an election of three million Americans. This court did not overturn a map, it overturned an election. It’s one thing for a court to check a legislature or an executive but the end-all and be-all of power in America should be the people.

Acyn

437,551 görüntüleme • 3 ay önce

bear 🐻 - use a compile block to process each part, instead of an hda. - make a large height map using a stamp node from one height map. #houdini
0:25

bear 🐻 - use a compile block to process each part, instead of an hda. - make a large height map using a stamp node from one height map. #houdini

tinybugbot

41,026 görüntüleme • 1 yıl önce

The multi-part Crownfall event comes to an epic close with Act IV, "The Spires of Skywrath," including a new overworld map, three distinct quests, new sidequests and minigames, and the introduction of an all-new playable character.
0:21

The multi-part Crownfall event comes to an epic close with Act IV, "The Spires of Skywrath," including a new overworld map, three distinct quests, new sidequests and minigames, and the introduction of an all-new playable character.

DOTA 2

327,611 görüntüleme • 1 yıl önce

CA politicians are announcing where they'll run on the Legislature's new map even though (1) the Legislature can't legally adopt a map and (2) Newsom's scheme to give them that power is losing badly in polls. I've never seen a group so confident they can rig an election.
4:37

CA politicians are announcing where they'll run on the Legislature's new map even though (1) the Legislature can't legally adopt a map and (2) Newsom's scheme to give them that power is losing badly in polls. I've never seen a group so confident they can rig an election.

Kevin Kiley

73,169 görüntüleme • 1 yıl önce

Archimedes' principle used in rescuing an elephant fallen in a well. The rule says that any object partially or completely submerged in a fluid experiences an upward force equal in magnitude to the weight of the fluid displaced by the object.
0:17

Archimedes' principle used in rescuing an elephant fallen in a well. The rule says that any object partially or completely submerged in a fluid experiences an upward force equal in magnitude to the weight of the fluid displaced by the object.

Ramesh Pandey

3,741,901 görüntüleme • 5 ay önce

Full vid of Ichigo dragging out the opponent to another map in #SparkingZero Destination maps are linked together, can be repeated infinitely, and are all empty maps (so he never goes to city or world tournament) Other example below
0:23

Full vid of Ichigo dragging out the opponent to another map in #SparkingZero Destination maps are linked together, can be repeated infinitely, and are all empty maps (so he never goes to city or world tournament) Other example below

Nyoh972

585,552 görüntüleme • 11 ay önce

Here's a copy/paste prompt recipe and vid showing exactly how to ask an LLM for an interactive map with satellite/map layers + a georeferencer that lets you see how old maps correspond with modern geography. Today the computer can’t make good print maps (that's your hill to climb ) but it can, with five bucks and twenty minutes, make good interactive maps. No software/GIS knowledge necessary, you just need a few nouns and an LLM. Scroll to the bottom for the repo/live map if you want those. I'm using Claude Code as an extension in VS Code but you can use the Claude CLI, Cursor, whatever. 1) Let's grab an old cadastral map and see who owned big tracts of a city; I found this an 1854 map of Niagara Falls, NY I found in the Library of Congress: , grabbed the .jp2, saved as a jpg from photoshop. 2) Let's ask Claude Code for a map. You can see exactly what I did in the video but my prompt, sans simple "hey it's busted" debugging, is written out in the following paragraphs. I explain the map-specific nouns in brackets. You can likely dump this whole thing in your LLM window and it'll work; I'd try plan mode + skip permissions. THE PROMPT Make an interactive map with MapLibre GL JS [maplibre is a javascript mapping library, a FOSS version of Mapbox GL JS. This lets us display tiled map data and arbitrary images on the map] Add basemap toggles with Esri satellite, Carto Positron, and OSM [these map layers require no API keys for light usage; Carto Positron is a nice road map layer and OSM is ugly but comprehensive] Add a globe/mercator projection toggle [I think the globe looks better at low zooms] Add a layer panel on the left with visibility checkboxes and delete buttons. Add a search box on the map that flies to results, with deletable pin markers [Makes this easy to get to your area of interest] Include an interactive local georeferencer: drop a JPG, pick ground control points on a zoomable/pannable image viewer, place them on the map, watch it warp with a progress bar centered on the map. [The georeferencer uses math ("affine transform"??) to match points on the old map to points on the new map; generally you click road intersections on the old map, match them on the new map, repeat a dozen times and everything aligns] The georeferenced map overlay defaults to 25% opacity with a slider above the control point list. [I want it easy to see the underlying modern geography] Add Export/import control point buttons [this saves the control points as a JSON so you can save and reimport your work] Add a button to export the warped image as a GeoTIFF with a .prj [In case you want to add the georeferenced image to a real GIS program like QGIS] Look up all relevant docs before starting [Claude sometimes uses outdated stuff] Split everything into separate HTML/CSS/JS files [Claude tends to pile everything in index.html, which is hard to read] Use Optima font, base color #FEFAF6 [I just like this style] Let me test with a local server [it serves it on a simple server so you can nav your host to localhost:8000 and try it out] Log all errors [so you don't have to play telephone with the LLM describing what's busted] 3) Once your LLM finishes, test it out in your browser; if it doesn't work, ask the LLM to check logs. Repeat 'til functional. 4) After this works on your computer, you can show it to everyone by hosting it on GitHub: prompt with "write a README explaining what everything does, add it to a new GitHub repo, deploy using GitHub pages, gimme the live URL" Here's what Claude made for me, try it yourself: • Upload the JPG in the repo, which is linked below • "Add GCP" • Click somewhere recognizable on the old map, like the tip of an island or a road intersection • Click the matching point on the new map • Repeat til you have least 3x points • Hit "georeference" • You'll see the old map atop the new map; if you want a better fit, delete bad points or add a dozen new ones, hit georeference again, repeat Repo: Is this map robust? Human-maintainable? Elegant? Performant? Secure? No, but *your* personal web map need not be. It just needs to work for *your* narrow use case, because it’s *your* map.
28:20

Here's a copy/paste prompt recipe and vid showing exactly how to ask an LLM for an interactive map with satellite/map layers + a georeferencer that lets you see how old maps correspond with modern geography. Today the computer can’t make good print maps (that's your hill to climb ) but it can, with five bucks and twenty minutes, make good interactive maps. No software/GIS knowledge necessary, you just need a few nouns and an LLM. Scroll to the bottom for the repo/live map if you want those. I'm using Claude Code as an extension in VS Code but you can use the Claude CLI, Cursor, whatever. 1) Let's grab an old cadastral map and see who owned big tracts of a city; I found this an 1854 map of Niagara Falls, NY I found in the Library of Congress: , grabbed the .jp2, saved as a jpg from photoshop. 2) Let's ask Claude Code for a map. You can see exactly what I did in the video but my prompt, sans simple "hey it's busted" debugging, is written out in the following paragraphs. I explain the map-specific nouns in brackets. You can likely dump this whole thing in your LLM window and it'll work; I'd try plan mode + skip permissions. THE PROMPT Make an interactive map with MapLibre GL JS [maplibre is a javascript mapping library, a FOSS version of Mapbox GL JS. This lets us display tiled map data and arbitrary images on the map] Add basemap toggles with Esri satellite, Carto Positron, and OSM [these map layers require no API keys for light usage; Carto Positron is a nice road map layer and OSM is ugly but comprehensive] Add a globe/mercator projection toggle [I think the globe looks better at low zooms] Add a layer panel on the left with visibility checkboxes and delete buttons. Add a search box on the map that flies to results, with deletable pin markers [Makes this easy to get to your area of interest] Include an interactive local georeferencer: drop a JPG, pick ground control points on a zoomable/pannable image viewer, place them on the map, watch it warp with a progress bar centered on the map. [The georeferencer uses math ("affine transform"??) to match points on the old map to points on the new map; generally you click road intersections on the old map, match them on the new map, repeat a dozen times and everything aligns] The georeferenced map overlay defaults to 25% opacity with a slider above the control point list. [I want it easy to see the underlying modern geography] Add Export/import control point buttons [this saves the control points as a JSON so you can save and reimport your work] Add a button to export the warped image as a GeoTIFF with a .prj [In case you want to add the georeferenced image to a real GIS program like QGIS] Look up all relevant docs before starting [Claude sometimes uses outdated stuff] Split everything into separate HTML/CSS/JS files [Claude tends to pile everything in index.html, which is hard to read] Use Optima font, base color #FEFAF6 [I just like this style] Let me test with a local server [it serves it on a simple server so you can nav your host to localhost:8000 and try it out] Log all errors [so you don't have to play telephone with the LLM describing what's busted] 3) Once your LLM finishes, test it out in your browser; if it doesn't work, ask the LLM to check logs. Repeat 'til functional. 4) After this works on your computer, you can show it to everyone by hosting it on GitHub: prompt with "write a README explaining what everything does, add it to a new GitHub repo, deploy using GitHub pages, gimme the live URL" Here's what Claude made for me, try it yourself: • Upload the JPG in the repo, which is linked below • "Add GCP" • Click somewhere recognizable on the old map, like the tip of an island or a road intersection • Click the matching point on the new map • Repeat til you have least 3x points • Hit "georeference" • You'll see the old map atop the new map; if you want a better fit, delete bad points or add a dozen new ones, hit georeference again, repeat Repo: Is this map robust? Human-maintainable? Elegant? Performant? Secure? No, but *your* personal web map need not be. It just needs to work for *your* narrow use case, because it’s *your* map.

Evan Applegate

15,772 görüntüleme • 5 ay önce

While reading a sign in the Behind the Waterfall area in Super Mario 64 DS, moving the camera to the left reveals an object that can appear as a Snifit, a coin, a Bob-omb or even as a "Coin-omb" depending on the angle. Stepping away from the sign reveals the object never existed.
0:29

While reading a sign in the Behind the Waterfall area in Super Mario 64 DS, moving the camera to the left reveals an object that can appear as a Snifit, a coin, a Bob-omb or even as a "Coin-omb" depending on the angle. Stepping away from the sign reveals the object never existed.

Supper Mario Broth

248,095 görüntüleme • 1 yıl önce

A mysterious object crashed in the Jabun region over Indonesia. If it were clearly a missile, a meteorite, or space debris, it would have fallen at an angle. The mysterious object fell vertically. This appears to be a UFO crash.
0:34

A mysterious object crashed in the Jabun region over Indonesia. If it were clearly a missile, a meteorite, or space debris, it would have fallen at an angle. The mysterious object fell vertically. This appears to be a UFO crash.

永倉盛照 nagakura moriteru

779,072 görüntüleme • 4 ay önce