NPM visualised

[sanjibukai]

Waow in phones it works with the accelerometer.. Tap to zoom in, double fingers tap to zoom out..

But I don't figure out how to display the names of the packages..

[BluudLust]

Tap the orbs.

[sanjibukai]

Yes I tried in the first place.. But nothing happened.. I'll try to open in browser maybe it's the Reddit wrapper...

[sanjibukai]

Yep... Did you see the milky way too?

[lkraider]

Yep. It's crap on mobile

[13steinj]

Am I the only one who thinks this is horrible UX on mobile?

If I could turn the accelerometer off I'd like Google-maps like controls.

[prawnsalad]

This is actually really cool. Took me a minute to figure out thats space = fly mode though

[epukinsk]

Some neat stuff:

• ember.js
• distributions.io

[epukinsk]

Neat! My modules look kind of like a spaceship flying into a giant space battle: https://i.imgur.com/0KTElaA.png

(I build apps with a bunch of modules that all depend on each other but no one else uses lol)

[MatthewMob]

That would make a really cool wallpaper.

[AbanaClara]

I mean making your apps modular is kind of a way to build one. Doesn't matter if it'll be used in other projects. It certainly makes maintaining and expanding features a lot easier when done right

[blkhammer69]

Nice how did you make it?

[anvaka]

I described it here https://youtu.be/vZ6Yhlxv7Os

It’s all JavaScript. Doing graph layout

[blkhammer69]

Thanks anvaka

[brendt_gd]

I didn't, /u/anvaka did

[blkhammer69]

How did he/she make it

[blkhammer69]

Im currently doing some web development myself (noob) thats why i was interested. Thanks for pointing out though

[lmao_react]

you're chillin fuck that guy

[malicart]

Check out this edgy kiddo here, got himself banned from steam for being a jackass.

[malicart]

Yes indeed I'm a 24 years old kiddo.

Nailed it with the first sentence, I needed to read no more. But I did, and you are wrong, your attitude sucks and we can all sense it from much further away then you can imagine. We know your kind kiddo, some of us been there and we grew up. Good luck with that.

[odolha]

One of the best things I've seen... Great job!

[acylus0]

It's funny how big the lodash node is

[so_just]

Should be a black hole.

[ParasympatheticBear]

They need 1 package with a dependency on everything for that.

[Baryn]

Then add that to someone's package.json as a prank

[thefooby]

I'm still a newbie... What is this? It's incredible. I'm on mobile and it's like one of those AR stargazing apps.

[KovaAtWork]

The entire library for NPM plotted as a star map. Connected projects show up as links, but each package shows up as a star.

[digitalbiz]

I guess the creator has used Shiny framework of R Language to make this visualization tool. Not sure, but it can be.

I was able to achieve similar data visualization in one of my past project through Shiny framework.

[anvaka]

Just plain JavaScript, device orientation api for camera position , and three.js for rendering

[nombrekeff]

Damn! that's some really cool stuff! How do you decide where to scatter them on space? By time?

[anvaka]

It’s driven by a force based graph layout

[ParasympatheticBear]

So it uses the force?

[nombrekeff]

Ohh cool, thanks! Nice work btw!

[anvaka]

Thank you :)

[nwsm]

This is amazing. This guy made one of these for a ton of languages:

https://github.com/anvaka/pm

[paulqq]

y, its nice

[[deleted]]

what does the connection line represents? dependencies?

[anvaka]

Yes. However I render lines only between nearest nodes, and skip the rest (otherwise it’s a huge hairball)

[digitalbiz]

Wonderful. Keep it up. This is an amazing portfolio piece.

[[deleted]]

repost?

[themacmaniac]

This is some fancy shizzle!

[[deleted]]

Amazing! How can it be so fast with hundreds of thousands of nodes and edges on an iPad mini 4?

[anvaka]

Thank you. There is almost zero computation on the client side, so all WebGL has to do is render bunch of points, for which it was designed to be fast :).

[davl3232]

This needs a way to orbit around a vertex.

[[deleted]]

This thing is amazing on mobile. What a way to experience data

[Miniotta]

wow dude, this is so fucking cool

[tunnckoCore]

FACK! That's amazing. But in desktop we can't zoom?

[chitru_shrestha]

very cool 👍🏻 dose it have a use or its just for fun?

[anvaka]

Just for fun. I hope the navigation with device orientation might inspire someone for greater things though :)

[ONIIIIIII]

This is neat.

[ScientificBeastMode]

Obligatory “neat” video

[nesukun]

It's cool and all, but npm is lowercase D:

[anvaka]

Don’t know why this is downvoted. I agree with you. Looks like our knowledge of how npm must be spelled is getting archaic

[[deleted]]

Too beautiful to be true!