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.

Was this page helpful?

Let us know how we did