[Custom Card] Dreame Vacuum Map Card - A Native App-Like Experience

Share your Projects! Dashboards & Frontend
1

Dreame Vacuum Map Card

GitHub link: GitHub - noambergauz/dreame-vacuum-map-card: Dreame Vacuum Map Card for Home Assistant Integration

Hey everyone!

I’ve been working on a custom Lovelace card for Dreame vacuum cleaners, and I’m excited to share the first version with you all.

While existing map cards are great, I wanted something that felt closer to the native Dreame app experience—smoother animations, better visuals, and easier control directly from the dashboard.

Features

  • Native Look & Feel: Designed to mimic the official Dreame app UI.
  • Live Map Updates: Real-time position tracking with smooth rendering.
  • Room Cleaning: Easily select specific rooms to clean.
  • Zone Cleaning: Support for zone selection (coming/in-progress).
  • Custom Theming: Supports both Light and Dark modes.
  • Performance: Built with React & TypeScript for a snappy experience.

Screenshots

Main Screen
Main Screen838×746 242 KB

Requirements

This card is designed to work best with the Dreame Vacuum Integration by Tasshack. Make sure you have that set up first!

Installation

Option 1: HACS (Custom Repository)

  1. Open HACS.
  2. 3-dot menu > Custom repositories.
  3. Add the GitHub URL
  4. Type: Dashboard.
  5. Click Add and then install the card.

Option 2: Manual

  1. Download dreame-vacuum-map-card.js from the (noambergauz/dreame-vacuum-map-card/releases).
  2. Upload it to your /config/www/ folder.
  3. Add the resource in your Dashboard settings (/local/dreame-vacuum-map-card.js).

Configuration

Add a manual card to your dashboard and use the following configuration:

type: custom:dreame-vacuum-map-card
entity: vacuum.your_robot_name
map_entity: camera.your_robot_map_entity
# Optional settings
theme: dark # or 'light'

Known Issues

  • Zone cleaning is broken
5 Likes
2

Nice job. - But how do i get the colored mad ?
i only see the option to get the greyd map that keeps updating.
its not looking like the images you show, and its without room names.

3

Well done! Finally a dreame card that resembles all the features in a neat ui.

Would it be possible for you to also add the cleaning cycles button that opens in the oem app when in room cleaning mode? Or is it there but I haven’t found it, yet? I’m using this quite a lot in the original app.