Skip to content

🚀🚀 New Feature: ROUTE SEARCH and TRAVEL TIME 🚀🚀

Choose a tag to compare

View all tags
@cataseven cataseven released this 28 Feb 05:01
v5.0.1
caa12aa
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Verified
Learn about vigilant mode.

⚠️⚠️⚠️PLEASE READ WHOLE NOTES AND UPDATED README DOCUMANTATION CAREFULLY⚠️⚠️⚠️

v5.0.1: Route Search Limit increased to: 50 and You don't need Geolocation API anymore

🗺️ Google Maps Card v5.0.0 — Route Search and Travel Time Calculator

image

Route

image image

Calculate real-time travel times between any combination of entities, zones, or addresses — right from your dashboard. The panel supports driving, walking, transit, and cycling modes with live traffic visualization on the map.

Highlights

🚗 Multi-Modal Route Calculation
Choose between Driving, Walking, Transit, or Cycling. For driving routes, the card fetches real-time traffic data and renders color-coded polylines directly on the map:

  • 🟢 Green — Normal flow
  • 🟡 Yellow — Slow traffic
  • 🔴 Red — Heavy traffic / Traffic jam

🔀 Alternative Routes with Traffic
When multiple route alternatives are available, each one is shown on the map. Switching between alternatives fetches and renders the correct traffic overlay for that specific route — not just the default.

📍 Smart Address Autocomplete
Uses the new Places API (New) with PlaceAutocompleteElement for a native, fast autocomplete experience. Type any address and get instant suggestions.

⚡ Route Shortcuts
Define frequently used routes (e.g., Home → Work) with custom icons and labels. One tap to calculate — no need to re-enter addresses every time.

  • Collapsible shortcut editor with label-based headers
  • Supports person, device_tracker, and zone entities
  • Custom MDI icons per shortcut

🔲 Docked Panel Layout
The panel docks to any side of the map — above, below, left, or right — with configurable size. Toggle visibility with a map button whose position is fully customizable from the Map Button Positioning section.

🔑 Required Google APIs

Users are solely responsible for their API settings, API Quotas, API Quota Alarms or any charges incurred on their Google Cloud account.

To use the Route Search & Travel Time Calculator, the following APIs must be enabled in your Google Cloud Console:

API Purpose
Directions API Route calculation, alternatives, duration & distance
Places API (New) Address autocomplete
Routes API Real-time traffic segment data for color-coded polylines

💡 These APIs are in addition to the Maps JavaScript API and Geometry library that the card already requires.

🛡️ API Quota & Cost Management — IMPORTANT

What we do on our side

This lovelace card enforces a built-in daily limit of 50 route calculations per API key. This counter is shared across all card instances using the same API key on the same browser. This is a safety net but that doesn't mean it will work perfectly and it can't be protect your api limits!!. It is not a budget tool. Google limits are also very high for free (even most of them are unlimited for free)

However in case Google change their api policy What YOU must do

Set up budget alerts and API quotas in Google Cloud Console. This is your responsibility.

  1. Go to APIs & Services → Quotas in Cloud Console
  2. Set a daily request limit for each API:
    • Directions API: e.g., 100 requests/day
    • Routes API: e.g., 100 requests/day
    • Places API (New): e.g., 500 requests/day
  3. Go to Billing → Budgets & Alerts and create a budget alert (e.g., $5/month)
  4. Consider restricting your API key to only the APIs you need

⚠️ Google provides a 10.000 search per month which covers significant usage. However, misconfigured automations or heavy usage can exceed this. The card's built-in 50/day limit is a soft guard — it is NOT a substitute for proper Cloud Console quota configuration. You are solely responsible for any charges incurred on your Google Cloud account.

📋 Configuration Options

type: custom:google-maps-card
api_key: YOUR_API_KEY
travel_panel_enabled: true
travel_panel_position: below        # above | below | left | right
travel_panel_size: 310              # Height (px) for above/below, Width for left/right
travel_panel_toggle_button_position: LEFT_BOTTOM
travel_shortcuts:
  - label: "Go to Work"
    icon: "mdi:office-building"
    from_entity: "person.cenk"
    to_entity: "zone.office"
  - label: "Go Home"
    icon: "mdi:home"
    from_entity: "person.cenk"
    to_entity: "zone.home"
Assets 3
Loading