darnton / leafletblazor Goto Github PK

I have Leaflet working on a Blazor-WASM project without problem, but when I try to get it working on a ServerSide project I get "Microsoft.JSInterop.JSException: Could not find 'L.map' ('L' was undefined).". I have tried everything I know but am unable to get around this issue. If you have any advice for me it would be greatly appreciated.

I've made changes locally to get this to work - will attempt to upload my mods.

Hi, I read your blog post. Thanks for the step-by-step explanation! It was really helpful.

1. Do you plan on actively maintaining this library?
2. You are probably aware of https://github.com/Mehigh17/BlazorLeaflet. Are there any specific reasons (e.g. missing requirements, incompatibilities) for why you chose to create a new one?

Greetings,
I'm trying to display some tiles I produced placed outside the wwwroot directory of a Blazor server.
As urlTemplate I insert the string "Tiles / MyMap / {z} / {x} / {y} .png" but LeafletMap does not display any map. is the correct way to describe urlTemplate?

Cannot change color of marker, the default is blue one. Please help me. THanks

I tried to extend the MarkerOptions by an Icon object like that.

public class Icon : InteropObject
{
        [JsonIgnore]
        public IconOptions IconOptions { get; set; }

        public Icon(string iconUrl)
        {
            this.IconOptions = new IconOptions()
            {
                IconUrl = iconUrl,
            };

        }

        protected override async Task<IJSObjectReference> CreateJsObjectRef()
        {
            return await JSBinder.JSRuntime.InvokeAsync<IJSObjectReference>("L.icon", IconOptions);
        }
}

public class IconOptions
{
    public string IconUrl { get; set; }
} 

Unfortunately the JS-Runtime throws an error because createIcon() does not exist. What is missing?

Hi, in nuget package 0.1.3 there are no accessable properties in the MarkeOptions class.

I was trying to add logic for including an Icon with a marker.

Should I not be able to do the following

Where Options represent Icon Options with the same names as ones provided by leaflet.

public class LeafletIcon .....

protected override async Task CreateJsObjectRef()
{
return await JSBinder.JSRuntime.InvokeAsync("L.icon", Options);
}

Then in the Marker options adding a property of LeafletIcon.

When I try the above I receive the following:

"Microsoft.JSInterop.JSException: t.icon.createIcon is not a function"

Or is there another way to go about adding an Icon to a marker ?

I am testing your interesting component .It works fine with your demo.
But if we put 2 components on the same page we got an error :
_Unhandled exception rendering component: Map container is already initialized.
How to proceed to use more than a component on one page?

I duplicated the existing TestRig with the exception of it being a Server (rather than WebAssembly) App. All works fine.

However, if I try to add markers to the map prior to viewing, the 'marker.AddTo' code throws an exception as JSBinder=null in Marker.CreateJsObjectRef

My noob understanding is that Interop should be available at the point OnAfterRenderAsync is called, but clearly everything isn't ready yet.

Any pointers are welcome.

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        await base.OnAfterRenderAsync(firstRender);

        var ll = new LatLng(-42, 175);

        var marker = new Marker(ll, new MarkerOptions
        {
            Title = "Test"
        });

        await marker.AddTo(PositionMap);

    }

Stack

	Darnton.Blazor.Leaflet.dll!Darnton.Blazor.Leaflet.LeafletMap.Marker.CreateJsObjectRef() Line 36	C#
 	Darnton.Blazor.Leaflet.dll!Darnton.Blazor.Leaflet.InteropObject.BindJsObjectReference(Darnton.Blazor.Leaflet.LeafletMapJSBinder jsBinder) Line 31	C#
 	Darnton.Blazor.Leaflet.dll!Darnton.Blazor.Leaflet.LeafletMap.Layer.AddTo(Darnton.Blazor.Leaflet.LeafletMap.Map map) Line 20	C#
 	LeafletServerBlazorTestRig.dll!LeafletServerBlazorTestRig.Pages.Index.OnAfterRenderAsync(bool firstRender) Line 177	C#

I am using a Web Assembly with hosted project and when trying copy the example, I noticed that when I try to set the reference to leaflet.css in index.html that the page is blank with no map rendering. If I take it out then parts of the map start to render. Any suggestions what would be causing this ? There are no errors showing up on the console.

First of all, thanks for your great work porting this library to Blazor. It would be great to include load geojson files functionality. Is one of most useful functions in the leaflet library. (https://leafletjs.com/examples/geojson/)

Hi, I really like your leaflet library and the simplicity! Is there a way to access all the leaflet methods so I can get the current position, change that position, zoom in and out etc.? I mean all that stuff in the doc, for example this: https://leafletjs.com/reference-1.7.1.html#map-methods-for-getting-map-state. There are hundreds of methods in Leaflet so I guess that would be a huge effort to implement or is there a generic way to call any method? Any plans for the future?