7 ms·

Show HN: Interactive Periodic Table in JavaScript

22 points by codedrome 7y ago

darekkay 7y 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 https://tips.darekkay.com/html/chemical-elements-en.html
- codedrome 7y 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 7y 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 7y 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.
- codedrome 7y 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.
vanderZwan 7y 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 https://observablehq.com/@bobkerns/elements-input (not to take anything away from the submitted periodic table - they're both really nice)
- graedus 7y ago
  Frequency illusion or Baader–Meinhof phenomenon https://en.wikipedia.org/wiki/List_of_cognitive_biases#Frequency_illusion https://en.wikipedia.org/wiki/List_of_cognitive_biases#Frequ...
  - vanderZwan 7y ago
    Thank you!
maximp 7y 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.
- codedrome 7y ago
  I'll put that on my todo list. This is very much the first version and I have many enhancements planned.
enjoyyourlife 7y ago
I still like https://ptable.com/ https://ptable.com/ better
shahedshah 7y 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.
- codedrome 7y ago
  Thanks for your suggestion - added to the list!

22 points by codedrome 7y 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 https://tips.darekkay.com/html/chemical-elements-en.html

codedrome 7y 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 7y 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 7y 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.

codedrome 7y 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.

vanderZwan 7y 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 https://observablehq.com/@bobkerns/elements-input (not to take anything away from the submitted periodic table - they're both really nice)

graedus 7y ago
Frequency illusion or Baader–Meinhof phenomenon https://en.wikipedia.org/wiki/List_of_cognitive_biases#Frequency_illusion https://en.wikipedia.org/wiki/List_of_cognitive_biases#Frequ...
- vanderZwan 7y ago
  Thank you!

maximp 7y 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.

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

enjoyyourlife 7y ago

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

shahedshah 7y 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.

codedrome 7y ago
Thanks for your suggestion - added to the list!