Show HN: Interactive Periodic Table in JavaScript

http://online.codedrome.com/periodictable/periodictable.htm

by codedrome • 6 years ago

22 13 6 years ago

online.codedrome.com

darekkay• 6 years ago

Is there a mobile/responsive version planned? It is currently simply condensed and unreadable on smaller viewpoerts.

Shameless related plug: Chemical Element of the Day [1]

[1] https://tips.darekkay.com/html/chemical-elements-en.html

codedrome4• 6 years ago

I'll try to make it mobile friendly but it might be difficult. There is a huge amount of information crammed in to the table but I will try to think of something.

bluebasket• 6 years ago

this is super cool! i clicked on the group names on the right thinking the filtering will happen automatically but you have to select them and apply on the left.

dreen• 6 years ago

Great job, looks really nice.

I have one suggestion. The colours are not colourblind-friendly. I suggest a colour palette picker (based on types of colour deficiency issues) or an ability to toggle subtle gradients.

codedrome4• 6 years ago

I agree entirely about the colours but I copied them from the Wikipedia version and they seem more or less standard so I didn't want to buck the trend. Maybe I'll add a high-contrast option.

vanderZwan2• 6 years ago

What's the name for that law when there's something you never think of and then you encounter multiple times really quickly? Because a couple of days ago, Bob Kerns published a really cool Periodic Table input element on Observable:

https://observablehq.com/@bobkerns/elements-input

(not to take anything away from the submitted periodic table - they're both really nice)

graedus• 6 years ago

Frequency illusion or Baader–Meinhof phenomenon

https://en.wikipedia.org/wiki/List_of_cognitive_biases#Frequ...

vanderZwan2• 6 years ago

Thank you!

maximp• 6 years ago

Very cool! I like the design. Would you consider applying filters on selection, without having to click the "Apply Filter" button? Feels smoother & more intuitive this way.

codedrome4• 6 years ago

I'll put that on my todo list. This is very much the first version and I have many enhancements planned.

enjoyyourlife• 6 years ago

I still like https://ptable.com/ better

shahedshah• 6 years ago

Oh wow. Thanks for sharing. This'll definitely be useful for my kids studies. It would be even better if filtering happened automatically when selecting options.

Edit: Oops. I should be paying more attention to comments as someone already suggested this.

codedrome4• 6 years ago

Thanks for your suggestion - added to the list!

Show HN: Interactive Periodic Table in JavaScript

Related Stories