Skip to content

๐ŸŒ An interactive voting map using Node + D3.js

Notifications You must be signed in to change notification settings

maximslo/votemap

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

13 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

VoteMap

Deployed: https://votemap.onrender.com/

Solution Design

An autonomous solution that fights voter suppression and ensures secure ballots.

Key Fob

Code enables the keyfob to communicate using infrared signals and UART (Universal Asynchronous Receiver-Transmitter), and also allows it to connect to a network via WiFi.

  • Infrared Communication: Allows the keyfob to send and receive data via infrared signals.
  • UART Communication: Facilitates wired data transmission and reception.
  • WiFi Connectivity: Enables the keyfob to connect to a network for additional functionalities.
  • Traffic Light Indication: Uses RGB LEDs to display different states like a traffic light system.
  • Device ID Display: Features a unique way to show the device's ID using the onboard LED.
  • User Interaction: Includes a button to change the device's ID.

The keyfob, once programmed with this code, operates automatically. It can send and receive data, change its display based on the received information, and communicate over a network. A user can interact with it via a button to change its ID.

MQTT ESP

This code implements a voting system using an ESP32 microcontroller. It integrates MQTT for network communication, allowing the system to publish and subscribe to topics related to voting. The application is designed to register votes from users, display voting states, and handle restrictions on voting.

  • Voting and State Selection Buttons: Utilizes GPIOs for user inputs to register votes and toggle through different states.
  • MQTT Communication: Leverages MQTT protocol for sending and receiving voting data over a network.
  • Alphanumeric Display: Displays the current state on a 14-segment display using I2C communication.
  • Restricted Voting: Maintains a list of restricted IDs, preventing them from voting.
  • LED Feedback: Provides visual feedback using RGB LEDs based on voting and system status.
  • Infrared Communication: Integrates IR transmission and reception for additional functionalities.
Functionality
  • Vote Registration: A button allows users to submit their vote, which is then published to an MQTT topic.
  • State Toggle: Another button enables users to cycle through predefined states (like Connecticut, Massachusetts, etc.).
  • MQTT Operations: Connects to an MQTT broker to publish votes and subscribe to topics that restrict voting based on user IDs.
  • Display State: The current state is displayed on an alphanumeric screen.
  • ID Reception: Receives and processes IDs via UART, checking against a list of restricted IDs.
  • LED Indicators: Changes LED colors to indicate the system status and vote validity.

MQTT JS

This Node.js application implements a real-time voting system utilizing MQTT for messaging, Express for serving web content, and Socket.io for real-time client-server communication. It monitors and updates vote counts in a CSV file and communicates with MQTT clients.

  • Real-time Vote Monitoring: Listens for changes in a CSV file and updates connected clients using Socket.io.

  • MQTT Integration: Connects to an MQTT broker to receive voting data and send restrictions.

  • Web Server with Express: Hosts a static website and serves an HTML file for displaying voting data.

  • CSV File Handling: Reads and updates a CSV file containing voting data.

  • Vote Receiving via MQTT: Receives votes sent to an MQTT topic and processes them.

  • Vote Count Update: Parses and increments vote counts in a CSV file based on received MQTT messages.

  • Client Notification: Notifies web clients in real-time of vote updates using Socket.io.

  • Web Interface: Serves a web interface where users can view the voting results.

  • File Watcher: Monitors changes in the CSV file to trigger client updates.

HTML Votemap

VoteMap is a web application designed for live visualization of polling data across different states. It uses D3.js for rendering an interactive map, Socket.io for real-time updates, and a backend that monitors vote counts in a CSV file. This application provides a dynamic, user-friendly interface to display and interact with live polling data.

  • Interactive Map Visualization: Utilizes D3.js to render an interactive map of the United States, displaying voting data per state.

  • Real-time Data Updates: Socket.io integration enables real-time updates to the map as new votes are recorded. CSV File Monitoring: Back-end logic watches for changes in a CSV file containing vote counts, triggering updates to the front end.

  • Responsive Design: Adapts to different screen sizes for optimal viewing on various devices.

  • Map Rendering: Upon loading, the application renders a map using GeoJSON data and colors each state based on the number of votes.

  • Data Processing: Reads voting data from a CSV file and maps it to the corresponding states on the map.

  • Real-time Interaction: Listens for 'file-updated' events via Socket.io to refresh the map and leaderboard with the latest data.

  • Leaderboard Display: Shows the top three states with the highest vote counts in a dynamically updated leaderboard.

Modules, Tools, Source Used Including Attribution

About

๐ŸŒ An interactive voting map using Node + D3.js

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published