jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-22 16:56:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update the map when making config changes (#3568)

Browse Source
This commit is contained in:
Bram Kragten 2019-09-03 06:17:03 +02:00 committed by Paulus Schoutsen
parent cf7a300614
commit fcd206e94b
2 changed files with 39 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/common/dom/setup-leaflet-map.ts
View File

@ -20,10 +20,19 @@ export const setupLeafletMap = async (
style.setAttribute("rel", "stylesheet");
mapElement.parentNode.appendChild(style);
map.setView([52.3731339, 4.8903147], 13);
Leaflet.tileLayer(
createTileLayer(Leaflet, darkMode).addTo(map);
return [map, Leaflet];
};
export const createTileLayer = (
leaflet: LeafletModuleType,
darkMode: boolean
) => {
return leaflet.tileLayer(
`https://{s}.basemaps.cartocdn.com/${
darkMode ? "dark_all" : "light_all"
}/{z}/{x}/{y}${Leaflet.Browser.retina ? "@2x.png" : ".png"}`,
}/{z}/{x}/{y}${leaflet.Browser.retina ? "@2x.png" : ".png"}`,
{
attribution:
'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>, &copy; <a href="https://carto.com/attributions">CARTO</a>',
@ -31,7 +40,5 @@ export const setupLeafletMap = async (
minZoom: 0,
maxZoom: 20,
}
).addTo(map);
return [map, Leaflet];
);
};

27
src/panels/lovelace/cards/hui-map-card.ts
View File

@ -15,6 +15,7 @@ import "../../map/ha-entity-marker";
import {
setupLeafletMap,
createTileLayer,
LeafletModuleType,
} from "../../../common/dom/setup-leaflet-map";
import computeStateDomain from "../../../common/entity/compute_state_domain";
@ -194,6 +195,12 @@ class HuiMapCard extends LitElement implements LovelaceCard {
if (changedProps.has("hass")) {
this._drawEntities();
}
if (
changedProps.has("_config") &&
changedProps.get("_config") !== undefined
) {
this.updateMap(changedProps.get("_config") as MapCardConfig);
}
}
private get _mapEl(): HTMLDivElement {
@ -210,6 +217,26 @@ class HuiMapCard extends LitElement implements LovelaceCard {
this._fitMap();
}
private updateMap(oldConfig: MapCardConfig): void {
const map = this._leafletMap;
const config = this._config;
const Leaflet = this.Leaflet;
if (!map || !config || !Leaflet) {
return;
}
if (config.dark_mode !== oldConfig.dark_mode) {
createTileLayer(Leaflet, config.dark_mode === true).addTo(map);
}
if (
config.entities !== oldConfig.entities ||
config.geo_location_sources !== oldConfig.geo_location_sources
) {
this._drawEntities();
}
map.invalidateSize();
this._fitMap();
}
private _fitMap(): void {
if (!this._leafletMap || !this.Leaflet || !this._config || !this.hass) {
return;