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 have a problem in using leaflet in powerbi plugin: in the constructor, I can Show the map,mark a location on it and every thing is ok:
export class Visual implements IVisual { private target: HTMLElement; private dataView: DataView; private map: L.Map; private basemap: L.TileLayer; private markerLayer: L.LayerGroup<L.CircleMarker>; constructor(options: VisualConstructorOptions) { console.log('constructor called'); this.target.innerHTML='<div id="map" style="height:100vh;width:100vw;"></div>'; this.basemap = L.tileLayer('http://localhost/mapfiles/{z}/{x}/{y}.png',{ maxZoom: 17,minZoom:10 }); this.map = L.map('map', { center: new L.LatLng(35.658, 51.403), zoom: 12, maxZoom: 18, minZoom: 12 }); this.map.addLayer(this.basemap); }
but! in public update,when (for Ex.)I want to mark another location, this.map is Undefined! and also Click event returns errors about "function not found" or "MouseEvent" is not declared.. I think the exact problem is after I add the layer to the map, Leaflet loses the map and cant find it again for editing! what can I do? is this a conflict between TS and JS?
[sorry for my grammer:) English is not my primary language]
I have a problem in using leaflet in powerbi plugin: in the constructor, I can Show the map,mark a location on it and every thing is ok:
export class Visual implements IVisual { private target: HTMLElement; private dataView: DataView; private map: L.Map; private basemap: L.TileLayer; private markerLayer: L.LayerGroup<L.CircleMarker>; constructor(options: VisualConstructorOptions) { console.log('constructor called'); this.target.innerHTML='<div id="map" style="height:100vh;width:100vw;"></div>'; this.basemap = L.tileLayer('http://localhost/mapfiles/{z}/{x}/{y}.png',{ maxZoom: 17,minZoom:10 }); this.map = L.map('map', { center: new L.LatLng(35.658, 51.403), zoom: 12, maxZoom: 18, minZoom: 12 }); this.map.addLayer(this.basemap); }
but! in public update,when (for Ex.)I want to mark another location, this.map is Undefined! and also Click event returns errors about "function not found" or "MouseEvent" is not declared.. I think the exact problem is after I add the layer to the map, Leaflet loses the map and cant find it again for editing! what can I do? is this a conflict between TS and JS?
[sorry for my poor grammer:) English is not my primary language]
It looks like there is a JS exception that.
We recommend to put debugger statement into constructor to debug visual step by step.
Ignat Vilesov,
Software Engineer
Microsoft Power BI Custom Visuals
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 |
---|---|
13 | |
2 | |
2 | |
1 | |
1 |