Showing posts with label VSCode. Show all posts
Showing posts with label VSCode. Show all posts

Friday, 18 October 2024

Announcing: vscode-map-preview 0.7.0

It has been brought to my attention that my vscode-map-preview extension now produces 401 responses for stamen map tiles, which has prompted me to put out a new release of this extension to better handle this situation.

This new release updates OpenLayers to 10.2.1 and now hides stamen tile layers from the base layer switcher if you don't have a Stadia Maps API key in your extension settings as this API key is now a requirement for viewing stamen tile layers.

Wednesday, 13 September 2023

Announcing: vscode-map-preview 0.6.0

This impromptu update fixes up Stamen tiles support to point to the new infrastructure managed by Stadia Maps.

Since we have to do this, we've taken this migration as an opportunity to add support for many more base layer types. 

The full list of base layers supported is now:

However, certain Bing and Stadia Maps layers will only be available in the base layer switcher if you provide respective API keys for these services through new configuration properties.

Don't like these base layers and want to bring your own? You can do that now too! If you have an XYZ tile set or WMTS service you want as a backdrop for your map previews, you can define such layers in your settings.json like so:

And they shall appear in the base layer switcher as layers you can switch to



This update also refactors the viewer HTML preparation by fetching the document (to be previewed) content on viewer init instead of embedding its content into the viewer HTML. This should improve responsiveness when previewing larger files, to the point that you can make out the new preview preparation message.

However, as I started to test this with bigger and bigger files, I eventually found a limit where the VSCode APIs will not cooperate with us. This limit is the point where VSCode will either not do syntax highlighting or tokenization or both and when we try to preview such a file, it will silently fail.

For this update, we will show a better error message on such files.

So for those who are hoping to use this extension to preview GeoJSON files whose size is in the range of gigabytes, sorry there's nothin I can do here 🤷‍♂️🤷‍♂️🤷‍♂️🤷‍♂️ I think at that point you are better served by using actual GIS tools/software for this purpose.

Now this this update is out the door, it's back to mapguide-rest development.

Tuesday, 12 September 2023

Another temporary detour

While I was deep into reviving mapguide-rest to make sure it works with the PHP 8.1 bundled with MapGuide Open Source 4.0, I missed the memo that Stamen Maps is now under new management: Stadia Maps.

The most important aspect of this announcement was that come October 2023 (a month from now), current stamen tile URLs may stop redirecting/working and you should have migrated over to Stadia Maps by then.

Because Stamen tiles carried the same role as OpenStreetMap as a freely accessible base tiled layer for various open source projects of mine, this announcement has thrown a spanner in my works because come next month, Stamen tiles may not work and for continued support for these layers would require migration over to Stadia Maps.

So I have momentarily suspended my work on mapguide-rest to give focus to one of my other projects affected by this announcement: My VSCode map preview extension.

Because continued support for stamen map tiles requires migrating the extension over to use Stadia Maps, we might as well take this opportunity to add support in the extension for other base layers that Stadia Maps offers. And while we're at it, we might as well go all the way and add in Bing Maps, XYZ and WMTS base layers as well.

Or, just have a gander at this clip for a taste of what the next version of the VSCode map preview extension can do!


The next version of the extension will drop real soon and then it is back to mapguide-rest development.

Thursday, 3 March 2022

Announcing: vscode-map-preview 0.5.9

This update tidies up the feature popup display so that overly long name and values are now ellipsized


The original un-ellipsized content is available as a mouseover tooltip


Although I couldn't verify it, the name and content values are now also sanitized with DOMPurify to guard against any potential XSS shenanigans.

This update also includes an updated OpenLayers (6.13.0)

Monday, 18 January 2021

Announcing: vscode-map-preview 0.5.8

This minor update fixes display of spatial data that spans the international date line by turning off the flag that causes OpenLayers to auto-wrap such features

Thursday, 31 December 2020

Announcing: vscode-map-preview 0.5.7

This final release of anything from me for 2020 fixes our KML content scrubbing code to no longer trash KML icon styles. OpenLayers didn't support KML icons properly when this extension was first created which necessitated scrubbing said content out when previewing KML files so that at least something will render in the preview instead of nothing.

That is no longer the case, so now KML icon styles are preserved when previewing. Case in point below, we now get cutlery icons instead of the standard pin marker.


One small caveat needs to be observed: Due to content security restrictions on the HTML generated by this extension, the KML icon URLs must be https otherwise nothing will render.

This release also updates OpenLayers to 6.5.0 and ol-layerswitcher to 3.8.3

Tuesday, 20 October 2020

Announcing: vscode-map-preview 0.5.6

This release updates OpenLayers to the latest 6.4.3, ol-layerswitcher to the latest 3.7.0 and adds support for opacity properties of the mapbox simple style spec for GeoJSON features.



Thursday, 1 October 2020

In awe of what vscode can do

I was originally hoping to drop the long awaited 2nd Preview of MapGuide Open Source 4.0 this week, but sadly some show-stopping bugs have crept up on the Linux side that means that sadly I have to push back the release until at least this one particular show-stopper for the PostgreSQL FDO provider is addressed.

Because this bug is present only on Linux it means we have to dive into gdb and try to debug through how this provider is producing garbage SRID values that result in broken PostGIS spatial queries.

Now normally I would dread at this prospect because gdb is command-line based and I miss being able to easily debug and step through code graphically with Visual Studio, but that was then and nowadays things are a lot different.

  • We now have VSCode, un-doubtedly the most popular code editor that is also multi-platform.
  • VSCode has extensions for C++ intellisense and integrated debugging with gdb
  • For MGOS 4.0, we now also build MapGuide/FDO for Linux inside docker containers.
  • VSCode also has extensions for remote development inside docker containers.

So this show-stopper has presented the perfect opportunity to see how hard or easy it is to tie all these pieces together for a nice debugging experience.

I start by spinning up the FDO build container and a PostgreSQL docker container to run our test code against.

Then after installing the remote extensions, I click the green box which then gives me an option to attach to a running docker container.


Which then shows the list of running docker containers, which includes my FDO build container


This then spawns up a second VSCode instance that allows me to open a folder within the running container. The FDO source code which I want to step through is accessible in this container, so I pick that folder.


Now if the experience here is the same as though I wanted to debug through this code from *outside* the container, I would then need to make sure the C++ extension is installed. I notice in this case that the extension UI shows local and remote installed extensions, so I have to install the C++ extension remotely.


If the debug experience for remote sources is the same as for local, then what should happen next is that I make a launch.json set up to run gdb with the executable that contains our test code. VSCode nicely creates a useful starting launch.json for me to tweak to what I need.

At this point, I make sure gdb is installed in the FDO build container, find some source code to stick some break points and hit the play button on the debug tab to start debugging and lo and behold ...

I am now visually debugging and stepping through the FDO source code! Just like Visual Studio on Windows. There was some small setup involved, but the process was mostly seamless.

VSCode is one truly amazing editor! With the right extensions, it can match any dedicated IDE in capabilities.

Now to tackle the actual show-stopper in question.

Monday, 20 July 2020

Announcing: vscode-map-preview 0.5.5

This release adds partial support for the Mapbox SimpleStyle spec for GeoJSON features




Many thanks to @vohtaski for the PR to add this support.

The other new feature is a new opt-in configuration property to de-clutter vector feature labels. To illustrate, here's a point KML preview with de-cluttering disabled (current behavior)


And here's the same KML preview with de-cluttering enabled


The other points/markers will be visible as you zoom in where there will be more "breathing space" for OpenLayers to draw the extra labels.

This release also updates:

  • OpenLayers to 6.3.1
  • ol-layerswitcher to 3.5.0

Sunday, 24 May 2020

Announcing: vscode-map-preview 0.5.2

This release future-proofs the extension by using the recommended webview APIs and adding a CSP to the generated preview HTML used to display the map.

In the grand scheme, everything should be working as before.

Special thanks to Matt Bierner of the VSCode team for the heads up on this issue.

Saturday, 1 February 2020

Announcing: vscode-map-preview 0.5.1

This release restricts the display of the new preview UI buttons to only files whose extension we know to be preview-able


The preview buttons now only display for the following file extensions:

  • .geosjon
  • .csv
  • .kml
  • .gml
  • .gpx
  • .igc

Although preview-able content may exist within .txt, .xml and .json files, these formats are too generic to reliably determine ahead of time if this is actually the case (before the preview command is run).

The preview commands can still be run the "old fashioned" way for all other cases.

Wednesday, 29 January 2020

Announcing: vscode-map-preview 0.5.0

Having figured out the technique for seamlessly loading CSV data in mapguide-react-layout, it was clear that there was another OpenLayers-based tool of mine that could benefit as well, hence a new release of the VSCode Map Preview extension.

Here's what's new in this release.

CSV Support

Obviously!


Rather than bombard you with excessive UI prompts for what column is the X coordinate and what column is the Y coordinate, we just check for a list of common column pairs:
  • X/Y
  • Lon/Lat
  • Lng/Lat
  • Long/Lat
  • Longitude/Latitude
  • Easting/Northing
If you want to add more column pairs to search for, there is a new configuration setting to define these pairs.


Preview buttons

Having learned about VSCode menu contribution points, we now finally have buttons in the editor UI to invoke the preview commands!



Custom Projection Support

The extension now supports custom projections allowing you to preview data from projections other than 4326 or 3857. A new configuration property is available to let you define additional custom projections:


To find/register your custom projection, visit epsg.io and get the proj.4 or proj4js definition for your particular EPSG code and add a new entry with this EPSG code and definition as per the above fragment.

Because of this support, the Map Preview (with projection) command now presents a list of known projections instead of requiring you to enter the EPSG code manually


Other Changes

Vertex styling for line/polygon features can now be toggled on/off through a new configuration property.


OpenLayers has also been updated to the latest release (6.1.1) and the extension fixes some corner cases when previewing certain types of KML and GeoJSON content.

Friday, 15 March 2019

Announcing: vscode-map-preview 0.4.6

A kind user alerted me to the fact that my Map Preview extension for Visual Studio Code was using APIs that have long been deprecated and could be removed any moment in a future release, breaking this extension in the process.

Although I haven't touched this code in a while (not intentional btw. One person can only tend to so many different open source projects), getting back into VSCode extension development was a very comfortable affair:

  • Update a few packages here and there. 
  • Update TypeScript. 
  • Read up on the new Webview API, which is what our extension should be using now.
  • Replace usages of vscode.previewHtml with the new Webview API.
  • Verify the extension still works
  • Get re-acquainted with how to publish VSCode extensions
And ... voila! A new version of the Map Preview extension is available for your VSCode installation to auto-update to.


In terms of changes, beyond some updates to OpenLayers and a small bug fix or two, there isn't really much to write home about, it should still be the same extension as before. This release was driven primarily by the need to move away from their old vscode.previewHtml API over to their new Webview API.

Once things have settled down on my other projects, I'd like to give this project some more attention. There's still some cool ideas I want to explore with this extension. I don't know if I still want to go down the Cesium route as previously hinted as there have been many more data viz players that have arrived on the scene since then and I also sort of do not want to detract from the original goal and purpose of this extension: An easy way to preview on a Map textual content that you are already editing or viewing in VSCode.

Friday, 24 June 2016

Let's introduce the other major player

My plans for the VSCode map extension now extend beyond just OpenLayers



At this point there are some small oddities:

  • The timeline button SVG has broken hrefs. You can see it from the missing play/pause/rewind graphics.
  • The Cesium InfoBox doesn't work.
This is probably due to a combination of:
  • Running cesium from the local file system
  • The VSCode/Electron webview or Cesium itself imposing sandboxing restrictions that breaks the InfoBox
Still, for the purposes of being able to quick and easily preview CZML content, this is a very nice starting point.

Friday, 17 June 2016

Announcing: vscode-map-preview 0.4.0

Today I pushed out a new version (0.4.0) of the vscode-map-preview extension. You might have already gotten a prompt from Visual Studio Code to auto-update to this version.

Here's some new features in this version.

Configuration Options

This version adds a bucket-load of configuration options around:
  • Controlling the style of vector features in your preview layer
  • Controlling the style of selected features in your preview layer
  • Controlling the display of the mouse coordinate tracker
  • Controlling the default base layer to use
Once saved to your user settings, these updated settings take effect on the next preview



Preview (with specific projection)

When previewing a file format, the source project can generally be inferred. For example, KML will always be EPSG:4326, for GeoJSON it should figure it out if you have a crs property on there.

But then you have formats like Well-Known Text (WKT), which we can render a preview of, but without proper contextual information such as projection, the data may not be placed where you expect it to be.

For example if we preview WKT as-is:


Because there is no projection context in the data itself, the coordinates are assumed to already be in EPSG:3857, and means the point lies just off the shores of Null Island, which in actuality, the above coordinates are actually supposed to be EPSG:4326 and is supposed to be the central business district of Melbourne, Australia.

To fix this, we need a way to declare that the data we're previewing is actually of a specific projection, which is what the new Map Preview (with projection) command gives us. It's just like the regular Map Preview command, but provides an input prompt for entering the proper EPSG code for this data.


Which will then be used as the projection of the data about to be previewed, ensuring the data is placed at the right location.


As an aside, you can put away that SQL Server Management Studio. VSCode with this extension is way more quicker and lightweight way for easy WKT visualization.

One caveat is that for this new command the only supported projections are:

  • EPSG:4326
  • EPSG:3857
I'll need to add custom projection support in order to be able to add support for more projections beyond the above two projections.


Other Changes

This version includes fixes to allow for subsequent map previews to work better and fixes various CSS issue with the map preview.

If you haven't already, check out and install the extension on the Visual Studio marketplace.

Wednesday, 8 June 2016

Introducing: Map Preview extension for Visual Studio Code

From an idea, to an MVP, to now a published extension on the Visual Studio Marketplace

I am proud to announce the availability of the Map Preview extension for Visual Studio Code

Just to recap for those who don't know, this extension allows you to view any plain-text based geospatial data file or content as vector features on an interactive map (powered by OpenLayers), allowing for quick and easy visualization of plain-text geographic content without firing up a dedicated GIS application to view it or pasting the content into a GitHub gist.



All rendered features are selectable on the map and any useful attribute information is displayed as a popup. The map also provides plenty of available base layers for giving your preview data a real-world contextual backdrop.

The initial release supports formats that are supported by OpenLayers, which is currently:
If your document content checks out as any of the above formats, it can be previewed on a map with this extension.

You can install this extension with the following command:

ext install vscode-map-preview

The source code for this extension is available on my GitHub repo

Feel free to send feedback, pull requests, etc, etc.

Thursday, 2 June 2016

Because sometimes making a gist on github is just too tedious

It started from a conversation today at work.

"You know how you can preview markdown files as HTML in Visual Studio Code?"
"Yeah"
"What if there was an extension that could do this previewing as well, but with non-binary geospatial data files like GeoJSON? So you don't have to ... you know ... go to github, make a gist, paste your GeoJSON and preview?"
"That would be awesome!"

So once I got home, I did some research to answer some questions that will test whether this idea is feasible:

That confidence boosting set of findings gave me enough motivation to fire up VSCode, yo generate a new TypeScript VSCode extension project, wait for npm to install 50 bajillion packages and set out to hack out an MVP extension for VSCode.

2 and a half hours later ...


I love it when you have an idea, the idea shows feasibility after some encouraging results from research and after some hacking around, you reach a point like the above gif that tells you ... yes this idea definitely has some legs and you should keep on going!