My Maps from Google

Google provides some extremely useful online tools that many of us have come to rely on. From Sheets, Slides, and Docs, to Gmail, Maps, and Keep, the advertising giant tends to cover all the angles. The most recent Google tool that I have started using is an improvement over an old service called My Places that started out as a part of Google Maps. It is called My Maps and provides users with the means to build custom annotated maps. Any maps you create can then be embedded into websites or shared via email and social media1.

When first visiting the site, you are offered an option to either create a new map or open an existing map. Any places you had in My Places are already transferred to My Maps and available to open if you wish.

Initial view after creating a map
Initial view after creating a map

Creating a new map presents you with a familiar Google Maps-style view but with additional overlays for editing the map. These are together at the top-left in two distinct groups. The first is the map structure where you can view and edit the name of the map and its layers, as well as add new layers and adjust the appearance of the base map layer. When I tried this, there were nine different base maps available; from left to right, top to bottom these are Map, Satellite, Terrain, Light Political, Mono City, Simple Atlas, Light Landmass, Dark Landmass, and Whitewater.

Map structure with "Base map" menu opened
Map structure with "Base map" menu opened

To edit the map name, map description, or layer name, just click the text.

Dialog for editing the map title and description
Dialog for editing the map title and description

Below the description are options to add a new layer and to share the map. There is also a drop down that provides options to open or create a map, delete, export, embed, and print the current map. Below that, each layer is shown. The layer drop down can be used to rename or delete the layer as well as view a data table of items on that layer. The data table allows you to add additional information about various things that have been added to the map (two columns for name and description are provided by default, but more can be added).

The My Maps toolbox
The My Maps toolbox

Next to the map structure is the toolbox. The toolbox contains a search bar, allowing you to find the area of the map on which to base your customizations. Below the search bar are buttons to undo, redo, select and manipulate, add places, draw lines, add directions, and measure distances and areas. Using these tools, you can build up map layers. When building the Stonehenge map for my blog post on our trip there, I was able to not only search for add mark existing places, but also add custom places. Each item added goes into the selected map layer, which is indicated by a colored bar on the left edge of the layer in the map structure. Clicking a layer changes the layer being edited.

Adding and editing a layer, showing the layer selection bar on the left edge
Adding and editing a layer, showing the layer selection bar on the left edge

The appearance of each item in a layer can be modified, either as a group or individually, by manipulating the styles option at the top of the layer and clicking the paint can icon on an individual item. By editing the layer style, you can also choose which column in the data table for that layer provides text for the items in that layer, and style items based on data in the data table (useful for representing data on the map). There is a lot of scope in this area, so I recommend playing around with it and seeing what works for your specific use case.

Editing the appearance of items on a layer is easy
Editing the appearance of items on a layer is easy

Once you are happy with the map you have created, you can share it, export it to KML (for use in Google Earth and other apps that support KML), and embed into websites. The main share options are familiar to anyone who has shared a document from Sheets, Slides, or Docs, allowing you to share a link to the map as well as control who can edit and view it. If you want to embed the map in a website, an embed code is provided via the map menu, however, as the site will tell you, you need to make the map public before you can embed.

Assigning permissions is consistent with other Google apps
Assigning permissions is consistent with other Google apps

All in all, I found My Maps a pleasant discovery and really nice to use. The styling options and ability to add additional data allow for some impressive customization. I am certainly going to use this application more in the future. How about you? Leave a comment and let me know your experiences with this new addition to Google's collection of online applications, or perhaps add details of alternatives that are out there.


  1. Those planning to use Google My Maps for commercial use should review Google permissions and license terms before proceeding 

Some of my favourite tools

Update: This post has been updated to recognise that CodeLineage is now maintained by Hippo Camp Software and not Red Gate Software as was originally stated.

If you know me, you might well suspect this post is about some of the idiots I know, but it is not, this is entirely about some of the tools I use in day-to-day development. This is by no means an exhaustive list, nor is it presented in any particular order. However, assuming you are even a little bit like me as a developer, you will see a whole bunch of things you already use, but hopefully there is at least one item that is new to you. If you do find something new and useful here, or you have some suggestions of your own, please feel free to post a comment.

OzCode

OzCode is an add-in for Visual Studio that provides some debugging super powers like collection searching, adding computed properties to objects, pinning properties so that you don't have to go hunting in the object tree, simpler tracepoint creation, and a bunch more. I first tried this during beta and was quickly sold on its value. Give the 30-day trial a chance and see if it works for you.

Resharper

This seems to be a staple for most C# developers. I was a late-comer to using this tool and I am not sure I like it for the same reasons as everyone else. I actually love Resharper for its test runner, which is a more performant alternative to Visual Studio's built-in Test Explorer, and the ability to quickly change file names to match the type they contain. However, it has a lot of features, so while this is not free, give the trial a chance and see if it fits.

Web Essentials

Another staple for many Visual Studio developers, Web Essentials provides lots of support for web-related development including enhanced support for JavaScript, CSS, CoffeeScript, LESS, SASS, MarkDown, and much more. If you do any kind of web development, this is essential1.

LinqPad

I was late to the LinqPad party, but gave it a shot during Ann Arbor Give Camp 2013 and within my first hour or two of using it, dropped some cash on the premium version (it is very inexpensive for what you get). Since then, whether it is hacking code or hacking databases, I have been using LinqPad as my standard tool for hacking.

For code, it does not have the overhead of creating projects and command line, WinForms or WPF wrapper tools that you would have to do in Visual Studio. For databases, LinqPad gives you the freedom to use SQL, C#, F# or VB for querying and manipulating your database as well as support for many different data sources beyound just SQL Server, providing an excellent alternative to SQL Management Studio.

LinqPad is free, but you get some cool features if you go premium, and considering the sub-$100 price, it is totally worth it.

JustDecompile

When Red Gate stopped providing Reflector for free, JetBrains and Telerik stepped up with their own free decompilers for poking around inside .NET code. These are often invaluable when tracking down obscure bugs or wanting to learn more about the code that is running when you did not write it. While JetBrains' dotPeek is useful, I have found that JustDecompile from Telerik has a better feature set (including showing MSIL, which I could not find in dotPeek).

Chutzpah

Chutzpah is a test runner for JavaScript unit tests and is available as a Nuget package. It supports tests written for Jasmine, Mocha, and QUnit, as well as a variety of languages including CoffeeScript and TypeScript. There are also two Visual Studio extensions to provide Test Explorer integration and a handy context menu. I find the context menu most useful out of these.

Chutzpah is a great option when you cannot leverage a NodeJS-based tool-chain like Grunt or Gulp, or some other non-Visual Studio build process.

CodeLineage

CodeLineage is a free Visual Studio extension from Hippo Camp Software2. Regardless of your source control provider, CodeLineage provides you with a simple interface for comparing different points in the history of a given file. The simple interface makes it easy to select which versions to compare. I do not use this tool often, but when I need it, it is fantastic.

FileNesting

This Visual Studio extension from the developer of Web Essentials makes nesting files under one another a breeze. You can set up automated nesting rules or perform nesting manually.

I like to keep types separated by file when developing in C#. Files are cheap and it helps discovery when navigating code. However, this sometimes means using partial classes to keep nested types separate, so to keep my solution explorer tidy, I edit the project files and nest source code files. I also find this useful for Angular directives, allowing me to apply the familiar pattern  of organizing code-behind under presentation by nesting JavaScript files under the template HTML.

Whether you have your own nesting guidelines or want to ensure generated code is nested under its corresponding definition (such as JavaScript generated from CoffeeScript), this extension is brilliant.

Switch Startup Project

Ever hit F5 to debug only to find out you tried to start a non-executable project and have to hunt for the right project in the Solution Explorer? This used to happen to me a lot, but not since this handy extension, which adds a drop down to the toolbar where I can select the project I want to be my startup project. A valuable time saver.

MultiEditing

Multi-line editing has been a valuable improvement in recent releases of Visual Studio, but it has a limitation in that you can only edit contiguous lines at the same column location. Sometimes, you want to edit multiple lines in a variety of locations and with this handy extension, you can. Just hold ALT and click the locations you want to multi-edit, then type away.

Productivity Power Tools

Productivity Power Tools for Visual Studio have been a staple extension since at least Visual Studio 2008. Often the test bed of features that eventually appear as first class citizens in the Visual Studio suite, Productivity Power Tools enhances the overall Visual Studio experience.

The current version for Visual Studio 2013 provides support for colour printing, custom document tabs, copying as HTML, error visualization in the Solution Explorer, time stamps in the debug output margin, double-click to maximize and dock windows, and much more. This is a must-have for any Visual Studio user.


  1. yes, I went there 

  2. though it was maintained by Red Gate when I first started using it 

Caching with LINQPad.Extensions.Cache

One of the tools that I absolutely adore during my day-to-day development is LINQPad . If you are not familiar with this tool and you are a .NET developer, you should go to www.linqpad.net right now and install it. The basic version is free and feature-packed, though I recommend upgrading to the professional version. Not only is it inexpensive, but it also adds some great features like Intellisense1 and Nuget package support.

I generally use LINQPad as a simple coding environment for poking around my data sources, crafting quick coding experiments, and debugging. Because LINQPad does not have the overhead of a solution or project, like a development-oriented tool such as Visual Studio, it is easy to get stuck into a task. I no longer write throwaway console or WinForms apps; instead I just throw together a quick LinqPad query. I could continue on the virtues of this tool2, but I would like to touch on one of its utility features.

As part of LINQPad , you get some useful methods and types for extending LINQPad , dumping information to LINQPad's output window, and more. Two of these methods are LINQPad.Extensions.Cache and Utils.Cache. Using either Cache method, you can execute some code and cache the result locally, then use the cached value for all subsequent runs of that query. This is incredibly useful for caching the results of an expensive database query or computationally-intensive calculation. To cache an IEnumerable<T>  or IObservable<T>  you can do something like this:

Or, since it's an extension method,

For other types, Util.Cache  will cache the result of an expression.

The first time I run my LINQPad code, my lazily evaluated query or the expression is executed by the Cache method and the result is cached. From then on, each subsequent run of the code uses the cached value. Both Cache methods also take an optional name for the cached item, in case you want to differentiate items that might otherwise be indistinguishable (such as caching a loop computation).

This is, as I alluded earlier, one of many utilities provided within LINQPad that make it a joy to use. What tools do you find invaluable? Do you already use LINQPad ? What makes it a must have tool for you? I would love to hear your responses in the comments.

Updated to correct casing of LINQPad, draw attention to Cache being an extension method for some uses, and adding note of Util.Cache3.


  1. including for imported data types from your data sources 

  2. such as its support for F#, C#, SQL, etc. or its built-in IL disassembly 

  3. because, apparently, I am not observant to this stuff the first time around. SMH 

Drop the BOM: A Case Study of JSON Corruption in WordPress

GiveCampIn September, I attended Ann Arbor Give Camp, a local event that connects non-profits with the local developer community to fulfill technological goals. As part of the project I was working on, I installed a plugin called CiviCRM into a WordPress deployment that was running on an IIS-based server.

It turned out that WordPress integration for CiviCRM was relatively new and a problem unique to IIS-based deployments existed after installation. This led to a white screen when I tried to access CiviCRM. I spent some time troubleshooting and eventually found the issue after I edited two files to track it down. The fix was quickly implemented. Unfortunately, I then discovered that some other features were not working properly.

The primary places this new issue surfaced were in displaying dialog windows within CiviCRM. It turned out that these dialogs obtained their UI via an AJAX call that returned some JSON and for some reason, jQuery was indicating that the call failed. Investigating further, I saw that the API call was successful (it returned a 200 status result) and the JSON appeared completely fine. How strange.

JSON in binary editor of Visual Studio
JSON in binary editor of Visual Studio

I made some debug changes to the JavaScript using the Google Chrome development tools and looked at the failure method jQuery was calling. In doing so, I discovered jQuery was reporting a parsing error for the JSON result. This seemed bizarre, after all, the JSON looked fine to me. I decided to verify it by copying and pasting it into Sublime. Still, the JSON looked just fine. Being tenacious, I saved the JSON to a text file and then opened it in Visual Studio's binary editor and there, the problem appeared. There were two characters at the start of the file before the first brace: byte order marks.

Corrupted JSON in Google Chrome developer tools
Corrupted JSON in Google Chrome developer tools

A byte order mark (often referred to as a BOM) is a Unicode character used to indicate the endianness (byte order) of a text file or stream1. JSON is not supposed to include them at all. In hindsight, I could have seen this issue much sooner if I had paid closer attention to the JSON response in the Network tab of Chrome's developer tools. This view had shown two red dots (see above) before the opening brace, each dot corresponding to a BOM that Chrome knew shouldn't be there. Of course, I had no idea what they meant and so I promptly ignored them. Lesson learned.

So, armed with the knowledge of why the JSON was causing parser errors, I had to find out what was causing this malformation and fix it. After reading about how a BOM in an incorrectly formatted PHP file2 could cause BOMs to be prepended in the PHP output, I started looking at each PHP file that would be touched when generating the API response. Alas, nothing initially stood out. I was getting frustrated when I had an epiphany; I had edited exactly two files in trying to fix the installation issue and there were exactly two BOMs. Coincidence?

I went to the two files that I had edited, downloaded them and discovered they both had BOMs. I re-saved them, this time without a BOM and uploaded them back to the site, which fixed the JSON corruption and got the CiviCRM plug-in in to working order.

In tracking down and fixing this self-made issue, I learned a few valuable lessons:

  1. Learn to use my developer tools
  2. Never assume it is not my fault
  3. It pays to understand how things work

Hopefully, my misfortune in this one incident will help someone track down their own issue with corrupted JSON in WordPress. If so, please share in the comments. Together, our mistakes can be someone else's salvation.


  1. Wikipedia – http://en.wikipedia.org/wiki/Byte_order_mark 

  2. one saved as Unicode with byte order mark 

Mouse without Borders and a VPN

When I'm working from home, I like to make use of the keyboard and mouse I normally use for my home super computer with my work laptop. Rather than unplug them from one machine to plug into the other, I use Mouse Without Borders.

Mouse Without Borders is awesome. It seamlessly integrates between the machines (with some customization options), allowing me to use both computers at the same time from the same keyboard and mouse, including clipboard and file drag-and-drop. I won't go into details on Mouse Without Borders, suffice to say that it is really rather lovely1.

However, I was having issues when working from home when it would just stop working. Both machines would report everything was fine and it seemed configured properly, yet the mouse would stop at the edge of one screen and no longer move other to the other. It was perplexing and annoying and I had no idea what was going on.

Then it hit me: I was using the work VPN. Mouse Without Borders uses the network to communicate between machines, so I quickly checked the Mouse Without Borders settings on my work laptop. There I discovered that it had switched over to the VPN.

Settings dialog for changing network binding in Mouse without Borders
Changing network binding in Mouse without Borders

I don't know idea why Mouse Without Borders does this on detecting my VPN IP address, but a quick change in the handy drop down fixes everything. Unfortunately, I appear to have to do this every time I use my VPN, but at least I now know what the heck is going on. Hopefully this will be helpful should you encounter the same issue.


  1. Amusing aside, while typing this on my home desktop, the wife brought me a lovely cup of tea and knocked the mouse over to my work laptop, stalling my blogging for a moment. I guess Mouse Without Borders has its downsides.