Markers not rendered after DataSource update

[ERDASA]

Hello:

When page initializes, I am  loading two markers as DataSource.  These markers are rendered correctly. 

If the user chooses a new location from a dropdown list, the markers' DataSource is updated (name, lat, long) but the markers are not rendered, although the tooltip shows the new name.

However, if the zoom factor is changed using the mouse wheel or the map is dragged, then the new markers are rendered.

[Baby Palanidurai]

Hi Erdasa, 

 

Sorry for the inconvenience.  

 

We have replicated the reported issue at our end. The maps control is not refreshed when the data source of the marker is updated dynamically. So we have created a feedback for this and we will resolve this issue in our upcoming patch release, which is expected to be roll out on or before 31^st July, 2019.  

 

Feedback link - https://www.syncfusion.com/feedback/7745 

  

If you have any more specification/precise replication procedure or a scenario to be tested, you can add it as a comment in the portal.  

 

Please let us know if you have any concerns. 

 

 

Thanks, 

Baby. 

[Baby Palanidurai]

Hi Erdasa, 

Thanks for your patience. 

We have resolved your reported issue in our latest Blazor package release. We have deprecated our current package to Syncfusion.EJ2.Blazor from Syncfusion.EJ2.AspNet.Core.RazorComponents. You can use the latest (17.2.0.46-beta) Syncfusion.EJ2.Blazor NuGet package version and updated interop CDN file to get rid of the reported issue. 

 

CDN Link for Interop file: https://cdn.syncfusion.com/ej2/17.2.46/dist/ejs.interop.min.js 

NuGet Package: https://www.nuget.org/packages/Syncfusion.EJ2.Blazor/17.2.0.46-beta 

Kindly revert us, if you have any concerns. 

Regards, 

Baby. 

[Ankit Bansal]

Can you please let me know how this is achievable ?

I tried in the latest version which is rolled out in december 2019 .Could not make it work ?

[Arun Raji]

Hi Ankit, 

 

We are validated your scenario. The reported scenario has not reproduced at our end. Even though the dynamic marker update has been working properly at our end in last blazor release, which is mentioned below. We have prepared a simple blazor sample in below location for your reference.  

Blazor proj – https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorApp-1805831418  

Blazor nuget - https://www.nuget.org/packages/Syncfusion.EJ2.Blazor/17.3.0.29-beta 

Code snippet –  

<EjsMaps Height="@height" Width="@width" @ref="Mapp"> 

   <MapsBorder Color="black" Width="1"></MapsBorder> 

    <MapsZoomSettings Enable="true" ZoomFactor="1"></MapsZoomSettings> 

    <MapsLayers> 

        <MapsLayer UrlTemplate="http://mt1.google.com/vt/lyrs=m@129&hl=en&x=tileX&y=tileY&z=level?authuser=0" LayerType="ShapeLayerType.OSM"> 

            <MapsShapeSettings Fill="#E5E5E5"> 

                <MapsShapeBorder Width="0.2" Color="black"></MapsShapeBorder> 

            </MapsShapeSettings> 

            <MapsMarkerSettings> 

                <MapsMarker DataSource="MarkerDataSource" Visible="true" Height="20" Width="20"> 

                    <MapsMarkerTooltipSettings Visible="true" ValuePath="name"></MapsMarkerTooltipSettings> 

                </MapsMarker> 

            </MapsMarkerSettings> 

        </MapsLayer> 

    </MapsLayers> 

</EjsMaps> 

 

@code { 

    EjsMaps Mapp { get; set; } 

    private string height { get; set; } = "100%"; 

    private string width { get; set; } = "100%"; 

 

    public ObservableCollection<MarkerData> MarkerDataSource { get; set; } 

    public class MarkerData 

    { 

        public double latitude { get; set; } 

        public double longitude { get; set; } 

        public string name { get; set; } 

        public static ObservableCollection<MarkerData> GetData() 

        { 

            ObservableCollection<MarkerData> MarkerDataSource = new ObservableCollection<MarkerData>() { 

                new MarkerData{ latitude= 45.240416, longitude= -100.310779, name= "South Dakota" } 

            }; 

            return MarkerDataSource; 

        } 

    } 

    protected override void OnInitialized() 

    { 

        this.MarkerDataSource = MarkerData.GetData(); 

    } 

 

    public void add() 

    { 

        this.MarkerDataSource.Add(new MarkerData { latitude = 19.1555762, longitude = 72.8849595, name = "Mumbai" }); 

    } 

} 

 

 

 

Let us know if you have any other concern. 

Thanks, 

Arun