Improved map panel and map card to ignore zones when fitting map. (#4447)

* Improved map panel and map card to ignore zones when fitting map. [#1598](https://github.com/home-assistant/home-assistant-polymer/issues/1598)

* Improved map panel and map card to ignore zones when fitting map. [#1598](https://github.com/home-assistant/home-assistant-polymer/issues/1598)

* Improved map panel and map card to ignore zones when fitting map. [#1598](https://github.com/home-assistant/home-assistant-polymer/issues/1598)

* Changed approach and created a different array for zones

* Removed zone key option for markers
This commit is contained in:
Krisjanis Lejejs 2020-01-12 18:56:55 +02:00 committed by Bram Kragten
parent b15270dfe2
commit a8ed87298a
2 changed files with 18 additions and 4 deletions

View File

@ -68,6 +68,7 @@ class HuiMapCard extends LitElement implements LovelaceCard {
false false
); );
private _mapItems: Array<Marker | Circle> = []; private _mapItems: Array<Marker | Circle> = [];
private _mapZones: Array<Marker | Circle> = [];
private _connected = false; private _connected = false;
public setConfig(config: MapCardConfig): void { public setConfig(config: MapCardConfig): void {
@ -284,6 +285,11 @@ class HuiMapCard extends LitElement implements LovelaceCard {
} }
const mapItems: Layer[] = (this._mapItems = []); const mapItems: Layer[] = (this._mapItems = []);
if (this._mapZones) {
this._mapZones.forEach((marker) => marker.remove());
}
const mapZones: Layer[] = (this._mapZones = []);
const allEntities = this._configEntities!.concat(); const allEntities = this._configEntities!.concat();
// Calculate visible geo location sources // Calculate visible geo location sources
@ -341,7 +347,7 @@ class HuiMapCard extends LitElement implements LovelaceCard {
} }
// create marker with the icon // create marker with the icon
mapItems.push( mapZones.push(
Leaflet.marker([latitude, longitude], { Leaflet.marker([latitude, longitude], {
icon: Leaflet.divIcon({ icon: Leaflet.divIcon({
html: iconHTML, html: iconHTML,
@ -354,7 +360,7 @@ class HuiMapCard extends LitElement implements LovelaceCard {
); );
// create circle around it // create circle around it
mapItems.push( mapZones.push(
Leaflet.circle([latitude, longitude], { Leaflet.circle([latitude, longitude], {
interactive: false, interactive: false,
color: "#FF9800", color: "#FF9800",
@ -406,6 +412,7 @@ class HuiMapCard extends LitElement implements LovelaceCard {
} }
this._mapItems.forEach((marker) => map.addLayer(marker)); this._mapItems.forEach((marker) => map.addLayer(marker));
this._mapZones.forEach((marker) => map.addLayer(marker));
} }
private _attachObserver(): void { private _attachObserver(): void {

View File

@ -98,6 +98,13 @@ class HaPanelMap extends LocalizeMixin(PolymerElement) {
} }
var mapItems = (this._mapItems = []); var mapItems = (this._mapItems = []);
if (this._mapZones) {
this._mapZones.forEach(function(marker) {
marker.remove();
});
}
var mapZones = (this._mapZones = []);
Object.keys(hass.states).forEach((entityId) => { Object.keys(hass.states).forEach((entityId) => {
var entity = hass.states[entityId]; var entity = hass.states[entityId];
var title = computeStateName(entity); var title = computeStateName(entity);
@ -136,7 +143,7 @@ class HaPanelMap extends LocalizeMixin(PolymerElement) {
}); });
// create marker with the icon // create marker with the icon
mapItems.push( mapZones.push(
this.Leaflet.marker( this.Leaflet.marker(
[entity.attributes.latitude, entity.attributes.longitude], [entity.attributes.latitude, entity.attributes.longitude],
{ {
@ -148,7 +155,7 @@ class HaPanelMap extends LocalizeMixin(PolymerElement) {
); );
// create circle around it // create circle around it
mapItems.push( mapZones.push(
this.Leaflet.circle( this.Leaflet.circle(
[entity.attributes.latitude, entity.attributes.longitude], [entity.attributes.latitude, entity.attributes.longitude],
{ {