Skip to content
Python Central Hub

Interactive Periodic Table

View on GitHub

Abstract

Interactive Periodic Table is a Python project that displays chemical elements and their properties in a GUI. It demonstrates data visualization, event handling, and Tkinter usage. This project is ideal for learning about educational tools, data display, and interactive interfaces.

Prerequisites

  • Python 3.6 or above
  • tkinter (usually pre-installed)
  • pandas (pip install pandaspip install pandas) for advanced features

Before you Start

Ensure Python and Tkinter are installed. For advanced features, install pandas.

Getting Started

  1. Create a folder named periodic-tableperiodic-table.
  2. Create a file named interactive_periodic_table.pyinteractive_periodic_table.py.
  3. Copy the code below into your file.
⚙️ Interactive Periodic Table
Interactive Periodic Table
"""
Interactive Periodic Table
 
A Python application that displays an interactive periodic table. Features include:
- Displaying information about elements when clicked.
- Searching for elements by name or symbol.
"""
 
import tkinter as tk
from tkinter import messagebox
 
# Sample data for the periodic table
elements = [
    {"symbol": "H", "name": "Hydrogen", "atomic_number": 1, "atomic_mass": 1.008},
    {"symbol": "He", "name": "Helium", "atomic_number": 2, "atomic_mass": 4.0026},
    {"symbol": "Li", "name": "Lithium", "atomic_number": 3, "atomic_mass": 6.94},
    {"symbol": "Be", "name": "Beryllium", "atomic_number": 4, "atomic_mass": 9.0122},
    {"symbol": "B", "name": "Boron", "atomic_number": 5, "atomic_mass": 10.81},
    {"symbol": "C", "name": "Carbon", "atomic_number": 6, "atomic_mass": 12.011},
    {"symbol": "N", "name": "Nitrogen", "atomic_number": 7, "atomic_mass": 14.007},
    {"symbol": "O", "name": "Oxygen", "atomic_number": 8, "atomic_mass": 15.999},
    {"symbol": "F", "name": "Fluorine", "atomic_number": 9, "atomic_mass": 18.998},
    {"symbol": "Ne", "name": "Neon", "atomic_number": 10, "atomic_mass": 20.180},
]
 
 
class InteractivePeriodicTable:
    def __init__(self, root):
        self.root = root
        self.root.title("Interactive Periodic Table")
 
        self.create_table()
 
    def create_table(self):
        """Create the periodic table layout."""
        for i, element in enumerate(elements):
            button = tk.Button(
                self.root,
                text=element["symbol"],
                width=10,
                height=3,
                command=lambda e=element: self.show_element_info(e),
            )
            button.grid(row=i // 5, column=i % 5, padx=5, pady=5)
 
    def show_element_info(self, element):
        """Display information about the selected element."""
        info = (
            f"Name: {element['name']}\n"
            f"Symbol: {element['symbol']}\n"
            f"Atomic Number: {element['atomic_number']}\n"
            f"Atomic Mass: {element['atomic_mass']}"
        )
        messagebox.showinfo("Element Information", info)
 
 
def main():
    root = tk.Tk()
    app = InteractivePeriodicTable(root)
    root.mainloop()
 
 
if __name__ == "__main__":
    main()
Interactive Periodic Table
"""
Interactive Periodic Table
 
A Python application that displays an interactive periodic table. Features include:
- Displaying information about elements when clicked.
- Searching for elements by name or symbol.
"""
 
import tkinter as tk
from tkinter import messagebox
 
# Sample data for the periodic table
elements = [
    {"symbol": "H", "name": "Hydrogen", "atomic_number": 1, "atomic_mass": 1.008},
    {"symbol": "He", "name": "Helium", "atomic_number": 2, "atomic_mass": 4.0026},
    {"symbol": "Li", "name": "Lithium", "atomic_number": 3, "atomic_mass": 6.94},
    {"symbol": "Be", "name": "Beryllium", "atomic_number": 4, "atomic_mass": 9.0122},
    {"symbol": "B", "name": "Boron", "atomic_number": 5, "atomic_mass": 10.81},
    {"symbol": "C", "name": "Carbon", "atomic_number": 6, "atomic_mass": 12.011},
    {"symbol": "N", "name": "Nitrogen", "atomic_number": 7, "atomic_mass": 14.007},
    {"symbol": "O", "name": "Oxygen", "atomic_number": 8, "atomic_mass": 15.999},
    {"symbol": "F", "name": "Fluorine", "atomic_number": 9, "atomic_mass": 18.998},
    {"symbol": "Ne", "name": "Neon", "atomic_number": 10, "atomic_mass": 20.180},
]
 
 
class InteractivePeriodicTable:
    def __init__(self, root):
        self.root = root
        self.root.title("Interactive Periodic Table")
 
        self.create_table()
 
    def create_table(self):
        """Create the periodic table layout."""
        for i, element in enumerate(elements):
            button = tk.Button(
                self.root,
                text=element["symbol"],
                width=10,
                height=3,
                command=lambda e=element: self.show_element_info(e),
            )
            button.grid(row=i // 5, column=i % 5, padx=5, pady=5)
 
    def show_element_info(self, element):
        """Display information about the selected element."""
        info = (
            f"Name: {element['name']}\n"
            f"Symbol: {element['symbol']}\n"
            f"Atomic Number: {element['atomic_number']}\n"
            f"Atomic Mass: {element['atomic_mass']}"
        )
        messagebox.showinfo("Element Information", info)
 
 
def main():
    root = tk.Tk()
    app = InteractivePeriodicTable(root)
    root.mainloop()
 
 
if __name__ == "__main__":
    main()
  1. Run the script: python interactive_periodic_table.pypython interactive_periodic_table.py

Explanation

Code Breakdown

  1. Import modules
import tkinter as tk
import tkinter as tk
  1. Set up element data
elements = [
    {'symbol': 'H', 'name': 'Hydrogen', 'atomic_number': 1},
    # ...more elements...
]
elements = [
    {'symbol': 'H', 'name': 'Hydrogen', 'atomic_number': 1},
    # ...more elements...
]
  1. GUI for table
root = tk.Tk()
root.title('Periodic Table')
# ...setup grid of buttons for elements...
root.mainloop()
root = tk.Tk()
root.title('Periodic Table')
# ...setup grid of buttons for elements...
root.mainloop()

Features

  • Displays elements in a grid
  • Shows properties on click
  • Search/filter functionality
  • Educational and interactive

How It Works

  • Loads element data
  • Displays each as a button
  • Shows details when clicked

GUI Components

  • Grid: Buttons for each element
  • Popup: Shows element details
  • Search box: For filtering

Use Cases

  • Chemistry education
  • Quick reference tool
  • Interactive learning

Next Steps

You can enhance this project by:

  • Adding more properties
  • Integrating with online databases
  • Improving UI design
  • Adding quizzes or games

Enhanced Version Ideas

def add_quiz_mode():
    # Quiz users on element facts
    pass
 
def fetch_online_data():
    # Get element info from web
    pass
def add_quiz_mode():
    # Quiz users on element facts
    pass
 
def fetch_online_data():
    # Get element info from web
    pass

Troubleshooting Tips

  • GUI not showing: Ensure Tkinter is installed
  • Element data missing: Check data source

Conclusion

This project teaches data visualization, event handling, and GUI basics. Extend it for more features and educational value.

If this helped you, consider buying me a coffee ☕

Buy me a coffee

Was this page helpful?

Let us know how we did