Tag Archives: openstreetmaps

Geography: one of the identified items was in an invalid format – Entity Framework

Hey everyone,

I’m currently working on a prototype using .net core, sql server, ef and NetTopologySuite to handle locations. While trying to save a location I ran into the following error:

Geography: one of the identified items was in an invalid format

My code was as follows:

using GeoAPI.Geometries;
using NetTopologySuite;
using NetTopologySuite.Geometries;

...
var geometryFactory = NtsGeometryServices.Instance.CreateGeometryFactory(srid: 4326);
...
Location = geometryFactory.CreatePoint(new Coordinate(request.Lat, request.Lng))
...

The solution ended up being pretty straight-forward. Simply swap the latitude and longitude values when creating a coordinate:

Location = geometryFactory.CreatePoint(new Coordinate(request.Lat, request.Lng))

// Use this instead
Location = geometryFactory.CreatePoint(new Coordinate(request.Lng, request.Lat))

This is mentioned pretty clearly when reading the documents but I somehow skipped over it. Hopefully this will be able to help out anyone else who does the same thing!

Official docs: https://docs.microsoft.com/sv-se/ef/core/modeling/spatial

Advertisements

Simple React-Leaflet Location Picker Setup

Hi everyone,

Just thought I’d share a very simple react-leaflet setup in case it’s able to help anyone.

screencast-localhost_3889-2019.08.24-14_01_41.gif

Add the css and javascript for leaflet to public > index.html:

  
https://unpkg.com/leaflet@1.5.1/dist/leaflet.js">https://unpkg.com/leaflet@1.5.1/dist/leaflet.js

Install react-leaflet via npm or yarn, also add the dependencies:

npm install react-leaflet # npm
npm install leaflet react react-dom # npm

yarn add react-leaflet # Yarn
yarn add leaflet react react-dom # Yarn

Create the map component:

import React, { useState } from 'react'
import { Map, TileLayer, Marker, Popup } from 'react-leaflet'


const MapSimple = () => {

    const [location, setLocation] = useState({
        lat: 51.505,
        lng: -0.09,
        zoom: 13,
    });
    const position = [location.lat, location.lng];
    
    const setMarkerPosition = e => {
        setLocation({ ...e.latlng, zoom: 19 });
        console.log(`My location is: ${JSON.stringify(e.latlng, null, 3)}`)
    };

    return (
        
            <TileLayer
                attribution='© OpenStreetMap contributors'
                url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
            />
            
                
                   A sample popup.
                
            
        
    )
}

export default MapSimple;