Register now to learn Fabric in free live sessions led by the best Microsoft experts. From Apr 16 to May 9, in English and Spanish.
I am trying to develop custom visual for Power BI. I have div element with leaflet map. When I do not set a height, visual is emplty. I can set a height with
this.mapDiv.style.height="300px";
But this is fixed.
How can I set height dynamically by viewport?
This is my code
private mapDiv: HTMLElement; constructor(options: VisualConstructorOptions) { this.mapDiv = document.createElement("div"); this.mapDiv.id = "mapid"; options.element.appendChild(this.mapDiv); var map = L.map('mapid'); map.setView([48.14, 17.12], 13); L.tileLayer('https:....', { minZoom: 4, maxZoom: 18, }).addTo(map); } public update(options: VisualUpdateOptions) { // this.mapDiv.style.height = "300px"; WORKS this.mapDiv.style.height = options.viewport.height.toString(); // DOESNT WORKS !!! }
Solved! Go to Solution.
You need to add the length unit.
this.mapDiv.style.height = options.viewport.height.toString() + "px";
You need to add the length unit.
this.mapDiv.style.height = options.viewport.height.toString() + "px";
I am trying to develop custom visual for Power BI. I have div element with leaflet map. When I do not set a height, visual is emplty. I can set a height with
this.mapDiv.style.height="300px";
But this is fixed.
How can I set height dynamically by viewport?
This is my code
private mapDiv: HTMLElement; constructor(options: VisualConstructorOptions) { this.mapDiv = document.createElement("div"); this.mapDiv.id = "mapid"; options.element.appendChild(this.mapDiv); var map = L.map('mapid'); map.setView([48.14, 17.12], 13); L.tileLayer('https:....', { minZoom: 4, maxZoom: 18, }).addTo(map); } public update(options: VisualUpdateOptions) { // this.mapDiv.style.height = "300px"; WORKS this.mapDiv.style.height = options.viewport.height.toString(); // DOESNT WORKS !!! }
Covering the world! 9:00-10:30 AM Sydney, 4:00-5:30 PM CET (Paris/Berlin), 7:00-8:30 PM Mexico City
Check out the April 2024 Power BI update to learn about new features.
User | Count |
---|---|
14 | |
2 | |
2 | |
1 | |
1 |