Blazor Enlazar archivos CSV con ubicaciones geográficas

    Con el componente de mapa Ignite UI for Blazor, puede trazar datos geográficos cargados desde varios tipos de archivos. Por ejemplo, puede cargar ubicaciones geográficas desde un archivo de valores separados por comas (CSV).

    Ejemplo de vinculación de archivos CSV con ubicaciones geográficas Blazor

    EXAMPLE
    MODULES
    RAZOR
    CSS

    ¿Te gusta esta muestra? Obtenga acceso a nuestro kit de herramientas de Ignite UI for Blazor completo y comience a crear sus propias aplicaciones en minutos. Descárgalo gratis.

    Ejemplo de datos

    Aquí hay un ejemplo de datos del archivo CSV:

    City,Lat,Lon,State,Code,County,Density,Population
    New York,40.7856,-74.0093,New Jersey,NJ,Hudson,21057,54227
    Dundee,42.5236,-76.9775,New York,NY,Yates,579,1650
    razor

    Fragmento de código

    El siguiente código carga y vincula IgbGeographicHighDensityScatterSeries en el componente de mapa a una matriz de objetos creados a partir de un archivo CSV cargado con ubicaciones geográficas.

    @using IgniteUI.Blazor.Controls
    @inject HttpClient Http
    
    <IgbGeographicMap Height="100%" Width="100%" Zoomable="true">
        <IgbGeographicHighDensityScatterSeries DataSource="DataSource"
            LatitudeMemberPath="Lat"
            LongitudeMemberPath="Lon"
            HeatMaximumColor="Red"
            HeatMinimumColor="Black"
            HeatMinimum="0"
            HeatMaximum="5"
            PointExtent="1"
            MouseOverEnabled="true" />
    </IgbGeographicMap>
    
    @code {
        private List<WorldPlaceCsv> DataSource;
    
        protected override async Task OnInitializedAsync()
        {
            string url = "https://static.infragistics.com/xplatform/data/UsaCitiesPopulation.csv";
            string csv = await Http.GetStringAsync(url);
    
            string[] csvLines = csv.Split(Environment.NewLine);
    
            List<WorldPlaceCsv> dataItems = new List<WorldPlaceCsv>();
    
            for (int i = 1; i < csvLines.Length - 1; i++)
            {
                string[] columns = csvLines[i].Split(",");
    
                WorldPlaceCsv location = new WorldPlaceCsv() {
                    Lat=  double.Parse(columns[1]),
                    Lon= double.Parse(columns[2]),
                    Name= columns[0],
                    Pop= double.Parse(columns[3])
                };
    
                dataItems.Add(location);
            }
    
            this.DataSource = dataItems;
    
            await Task.Delay(1);
        }
    
        public class WorldPlaceCsv {
    
            public string Name { get; set; }
    
            public double Lat { get; set; }
    
            public double Lon { get; set; }
    
            public double Pop { get; set; }
    
            public string Country { get; set; }
            public bool Cap { get; set; }
        }
    }
    razor

    Referencias de API