StreamPoint Display Issue

[Flouriane]

Hello,

I am encountering an issue with displaying StreamPoint objects in LeafletForBlazor. While the points are successfully added via the add() method and are visible in the map’s data filters, they do not visually render on the map itself.

Map and Point Configuration Basemap: Using RealTimeMap.BasemapLayer with OpenStreetMap. Zoom Level: Configured to ensure visibility. Coordinates: Tested with specific coordinates (latitude = 43.6, longitude = 3.8).

Here is the code used to add a point with a symbol:

   protected override void OnInitialized()
    {

        parameters = new RealTimeMap.LoadParameters
        {
            location = new RealTimeMap.Location
            {
                latitude = 43.6,
                longitude = 23.09
            },
            zoomLevel = 10,
            basemap = new RealTimeMap.Basemap
            {
                basemapLayers = new List<RealTimeMap.BasemapLayer>
                {
                    new RealTimeMap.BasemapLayer
                    {
                        url = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
                        attribution = "© OpenStreetMap contributors",
                        minZoom = 1,
                        maxZoom = 19
                    }
                }
            }
        };

        base.OnInitialized();
    }

    private async Task AddMarker()
    {
        double latitude = 43.6;
        double longitude = 3.8;

        var point = new RealTimeMap.StreamPoint
        {   
            type ="Station 1",
            latitude = latitude,
            longitude = longitude,
            value = new RealTimeMap.PointSymbol
            {
                radius = 10,
                color = "blue",
                fillColor = "yellow",
                fillOpacity = 0.8,
                opacity = 1.0
            }
        };
        await leafletMap.Geometric.Points.add(point);
        afficherMap = true;
    }
}

Observed Outcome Expected Outcome: The point should display on the map at the specified coordinates with the colors defined in PointSymbol. Actual Outcome: The point does not appear visually on the map, although it is visible in the map’s data filters and during debugging. Environment LeafletForBlazor Version: 2.2.0.8 Framework: Blazor Server / Blazor WebAssembly Browser: Chrome / Firefox (tested on multiple browsers) Actions Taken Increased zoom level. Tested different colors and sizes for PointSymbol. Verified basemap and point positions. Thank you in advance for any help in resolving this issue. Any solutions or recommendations would be greatly appreciated!

[ichim]

Hello sir,

value property of the StreamPoint is used to extend the data structure of this object (StreamPoint). It cannot be used to change the StreamPoint appearance.

Your code should be:

<RealTimeMap @ref="leafletMap" width="460px" OnAfterMapLoaded="AddMarker" height="460px" />
@code{
    RealTimeMap? leafletMap;

    private async Task AddMarker()
    {
        leafletMap.Geometric.Points.Appearance(item => item.type == "Station 1").pattern = new RealTimeMap.PointSymbol
            {
                radius = 10,
                color = "blue",
                fillColor = "yellow",
                fillOpacity = 0.8,
                opacity = 1.0,
                weight = 2  //add line weight, default is 0
            };

        double latitude = 43.6;
        double longitude = 3.8;
        var point = new RealTimeMap.StreamPoint
            {
                type = "Station 1",
                latitude = latitude,
                longitude = longitude,

            };
        await leafletMap.Geometric.Points.add(point);
    }
}

Appearance() method can change the way points are displayed. You can find more here: https://github.com/ichim/LeafletForBlazor-NuGet/tree/main/RealTimeMap%20Geometric.Points%20Appearance