ThinkGeo.com    |     Documentation    |     Premium Support

Blazor OpenStreetMaps

Hello,
I am new to ThinkGeo, before proceeding with the purchase of the license, I am evaluating the version of ThinkGeo for Blazor.
For my project I need to display an OpenStreetMaps level, where the tiles are located locally on the server.
I would like to know if with ThinkGeo blazor it is possible to view the cards, and if it is possible to have the link where to take an example.

Thank you.

Hey @Marco1,

I’m fairly confident that we can get your data on the map, but I just need to know what format your OpenStreetMap data is in. Is it PBF, ShapeFile, GeoTiff, or something else?

Thanks,
Kyle

Hi kyle,
is a georeferenced dwg file that is converted into a raster base map with OSM structure (…/ z / x / y.png).
So I would like to know how to be able to view tiles in ThinkGeo MapView.
The folders with the files are located inside the blazor server project, which communicates with the Blazor Webassembly project through the controller.
I wanted to know if even in this situation of mine you need to use an apikey, or if the apikey is only necessary to access ThinkGeo cloud services?

Thanks Marco.

Hey @Marco1,

No, you do not need an API key. It is only used for ThinkGeo Cloud services.

The Z/X/Y.png setup mimics a TileCache, not a datasource. Because of this, it might be better to just use the DWG file:

CadFeatureLayer layer = new CadFeatureLayer(@"myfile.dwg", CadStylingType.EmbeddedStyling);
LayerOverlay layerOverlay = new LayerOverlay();
layerOverlay.Layers.Add(layer);
mapView.Overlays.Add(layerOverlay);

The reason to use this over the images is because it’s more efficient and since the tiles are static, you would have a lot of issues showing the images when using even the slightest different ZoomLevelSet or MapUnit.

For example, let’s say that those images on Z=16 were created to a world scale of 1:10000. In your map, you need to make sure that ZoomLevelSet.ZoomLevel16’s scale is exactly 1:10000. If it were 1:20000, you would have a very misleading basemap where the perceived scale would be double it’s actual scale.

My best advice is to keep it in a vector format (dwg, shapefile, or otherwise), or utilize georeferenced raster formats such as GeoTiff. And if you want to have Z/X/Y.pngs, use them only as a TileCache of a georeferenced datasource.

Thanks,
Kyle

hi kyle,
this solution is interesting, and it is simpler.
I tried to apply it on my Blazer WebAssembly project,
but all my attempts have failed, I always get the same error: ‘The type initializer for’ ThinkGeo.Core.CadFeatureSource ‘threw an exception.’
Page code

<div class="map-container raster-basemaps">
    <MapView Id="map" Zoom="4" MapUnit="@ThinkGeo.Core.GeographyUnit.Meter" >
        <OverlaysSetting>
            <LayerOverlay Id="CustomOverlay" Layers="@gclayers"/>
        </OverlaysSetting>
        <MapToolsSetting>
            <MapTools>
                <ZoomBarMapTool />
            </MapTools>
        </MapToolsSetting>
    </MapView>
</div>

@code
{
GeoCollection gclayers = new GeoCollection();

protected override void OnInitialized()
{
    try
    {            
        CadFeatureLayer cadLayer = new CadFeatureLayer("./dwg/NameDwgTest.dwg");
        gclayers.Add("CAD", cadLayer);
    }
    catch(Exception ex)
    {
        string s = ex.Message;
    }
}

}

the file is located inside wwwroot/dwg/NameDwgTest.dwg
Is the solution you described also applicable with Blazor webassembly?
Is there any example project?
But with the CadFeatureLayer class is it possible to interact (example on / off of the layers) with the layers present in the dwg file?
sorry if I ask all these questions, but the time zone does not allow me to work properly.

Thanks Marco.

Hi Kyle,
In fact awaiting your answers, I have other attempts but to no avail.
Trying the introductory project for Blazor (https://docs.thinkgeo.com/products/web-maps/v12.0/quickstart/#quick-start-display-a-simple-map-on-blazor)
continues to encounter the same errors in the previous message and in addition I have encountered these errors:

Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
Unhandled exception rendering component: System.Diagnostics.Process is not supported on this platform.
System.PlatformNotSupportedException: System.Diagnostics.Process is not supported on this platform.
at System.Diagnostics.Process.GetCurrentProcess()
at ThinkGeo.Core.ThinkGeoLicenseVerification.hRU=()
at ThinkGeo.Core.ThinkGeoLicenseVerification.jxU=(Assembly assembly)
at ThinkGeo.Core.ThinkGeoLicenseVerification.hhU=(Boolean needToShowProductCenter)
at ThinkGeo.Core.ThinkGeoLicenseVerification.get_LicenseVerificationResult()
at ThinkGeo.Core.ValidatorHelper.CheckStatus()
at ThinkGeo.Core.ValidatorHelper.CheckObjectIsNotNull(Object parameterObject, String parameterName)
at ThinkGeo.Core.ShapeFileFeatureSource.set_Encoding(Encoding value)
at ThinkGeo.Core.ShapeFileFeatureSource…ctor(String shapePathFilename, String indexPathFilename, FileAccess readWriteMode, Encoding encoding)
at ThinkGeo.Core.ShapeFileFeatureLayer…ctor(String shapePathFilename, String indexPathFilename, FileAccess readWriteMode, Encoding encoding)
at ThinkGeo.Core.ShapeFileFeatureLayer…ctor(String shapePathFilename, String indexPathFilename, FileAccess readWriteMode)
at ThinkGeo.Core.ShapeFileFeatureLayer…ctor(String shapePathFilename)
at GpsAmsWeb.Pages.PgNavigazione.OnInitialized() in C:\Users\PC\Desktop\Progetti_insert\GpsWeb\GpsAmsWeb\Pages\PgNavigazione.razor:line 32
at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync()

Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
Unhandled exception rendering component: Cannot read properties of undefined (reading ‘addOrUpdateTileLayer’)
TypeError: Cannot read properties of undefined (reading ‘addOrUpdateTileLayer’)
at Object.invoke (https://cdn.thinkgeo.com/blazor/1.0.0/blazor.js:2:24250)
at https://localhost:44327/_framework/blazor.webassembly.js:1:3942
at new Promise ()
at Object.beginInvokeJSFromDotNet (https://localhost:44327/_framework/blazor.webassembly.js:1:3908)
at Object.w [as invokeJSFromDotNet] (https://localhost:44327/_framework/blazor.webassembly.js:1:64232)
at _mono_wasm_invoke_js_blazor (https://localhost:44327/_framework/dotnet.5.0.17.js:1:190800)
at do_icall (wasm://wasm/00aba242:wasm-function[10596]:0x194e4e)
at do_icall_wrapper (wasm://wasm/00aba242:wasm-function[3305]:0x79df9)
at interp_exec_method (wasm://wasm/00aba242:wasm-function[2155]:0x44ad3)
at interp_runtime_invoke (wasm://wasm/00aba242:wasm-function[7862]:0x12efff)
Microsoft.JSInterop.JSException: Cannot read properties of undefined (reading ‘addOrUpdateTileLayer’)

at the moment I have activated the trial license for blazor.
Do I need to include any files and / or keys in the project?
What am I doing wrong? what am I forgetting?
i can’t figure out where i am going wrong in a project.

taranto.zip (3.6 MB)

I was able to understand the problem,
I was trying to use ThinkGeo on a Blazor webassembly application.
I converted it to Blazor server and now I no longer receive any errors and I can correctly view the ThinkGeo maps.
The code sent to me as an example still can’t get it to work:

CadFeatureLayer layer = new CadFeatureLayer (@ “myfile.dwg”, CadStylingType.EmbeddedStyling);
LayerOverlay layerOverlay = new LayerOverlay ();
layerOverlay.Layers.Add (layer);
mapView.Overlays.Add (layerOverlay);

keep giving me error.
Mocking it like this:

MapView MapUnit = “@ ThinkGeo.Core.GeographyUnit.Meter” Zoom = “3”>
OverlaysSetting>
LayerOverlay Layers = “layers” />
/ OverlaysSetting>
/ MapView>
@code {
GeoCollection layers = new GeoCollection ();

protected override void OnInitialized ()
{
    CadFeatureLayer layer = new CadFeatureLayer (@ "./ Data / taranto.dwg", CadStylingType.EmbeddedStyling);
     layers.Add (layer);
}

}

I no longer receive any errors, but in any case I do not see the contents of the dwg file.
attached the dwg file that I am trying to open, it is a georeferenced file EPSG 3003 (city of Taranto google coordinates 40.45709711861765, 17.26360952471357).

Thank you.
best regards.

Hey @Marco1,

So, I dug into more on CAD with Blazor using your sample DWG file and it turns out that there are incompatibilities with the backend. If you open your browser’s console, you’ll see there is an exception referring to System.Windows.Point. it appears that the backend depends on the Windows platform. Hardly suitable for browsers.

That said, I think we can figure out a workaround. I took the geometries in the DWG file and converted them into a ShapeFile. I’ve attached it here:

https://thinkgeo.sharepoint.com/:u:/g/Eabv197MFtlGjgzRb3LSFOkBknFCvPtZ27g01OeDFmSl4A?e=sbOzMU

Try using that instead. The problem is that it seems like the geolocation of the geometry is in the ocean. In your other post, I set up the DWG file in Winforms and came across the same thing. I think there is something wrong with your file’s projection. If you can double check that, it would be good.

As for your Tiled images, I haven’t tried setting something like that up quite yet because that involves quite a bit of legwork to get started. I honestly think it’d be better to just use the vector formats if you can get the projection issue solved.

Thanks,
Kyle