Labels and Collision Checking

You can create high quality labels using CanvasMap but it may take some time to get them just the way you want. Here are some key points:

• The simpler the font, the cleaner the easier it will be for users to read the labels. CanvasMap supports GoogleFonts but we recommend using simple fonts and event the standard web fonts can produce excellent maps.
• Adding a halo or an outline around the text can make it stand out from complex backgrounds. Otherwise, the user may not be able to read the text.

The geographic map of Africa example example shows a variety of methods for changing settings in a CanvasMap including labels.

Labels

Labels are text that can be placed over point features in a map. The basic text settings are those supported by the Canvas element and are defined in the reference material for the CMItem object. Below is an examlpe that uses a white fill and a black outline:

// setup the labels
TheCityLayer.SetSettingAttribute("TextStyle","Text","name"); // get the label from the "name" attribute
TheCityLayer.SetSetting("TextStyle","font","30px Arial");
TheCityLayer.SetSetting("TextStyle","fillStyle","white");
TheCityLayer.SetSetting("TextStyle","strokeStyle","black");

You can also set the text settings in one settings call. The example below uses a black shadow on white text:

TheLayer.SetSettings({TextStyle:
{
	 font:"20px Arial",
	 fillStyle:"rgba(255,255,255,1)",
	 strokeStyle:"rgba(0,0,0,1)",
	 shadowBlur:12,
	 shadowOffsetX:4,
	 shadowOffsetY:3,
	 shadowColor:"rgba(0,0,0,1)"
}}); 

Label Boxes

CMLayer objects have support for a box for labels. This includes a "Position" settings for how to position the box adjacent to its point. The Position values are specified with a two charater string to indiate "top-left", "top", "top-right", "right, "bottom-right", etc. They are also availablein the array:

CMLABEL_LOCATIONS=["TL","T","TR","R","BR","B","BL","L"];

Settings for OffsetX and OffsetY specify how far to move the box from its point.

Labels for Polylines and Polygons

At this time, labels are not supported for polylines and polygons but you can add them by creating point files with where you would like the labels to appear, setting the style for the layer to transparent and then setting the label style to be visible. Thus, only the labels will appear.

Collision Checking

You may have noticed that marks in CanvasMaps may not appear if they are crowded together. This is "collision detection" and it also works for labels. Collison detection can be turned off by setting the "CMView" setting "CollisionChecking" to false.