CanvasMap
Getting Started Tutorials 3D Reference

Adding North Arrows and Graticules

Since we are now displaying projected data, we might need to display a north arrow and/or graticules to let the reader know the direction of north in our maps.

North Arrows

North arrows are supprted by using Scalable Vector Graphics (SVG) descriptions of the arrows. The example below shows how a SVG file is is used to create the north arrow in the Humboldt Bay example. The Scale parameter will size the north arrow. Note that north arrows are added as MapElements to the Scene.

 var TheNorthArrow=new CMNorthArrow();
 TheNorthArrow.SetSetting("NorthArrow","Scale",1.6);
 TheNorthArrow.SetSetting("NorthArrow","URL","https://gsp.humboldt.edu/CanvasMapWebsite/CanvasMap/svg/CompassRose2.js
");
 var TheScene=TheMainContainer.GetScene();
 TheView.AddMapElement(TheNorthArrow);

Graticules

Graticules are rather complicated in their implementation but easy to add to maps with CanasMap. The code below will add a set of graticules including providing geographic coordinates around the border of the map. See the reference page for the CMLayerGraticule for all of the other settings.

var TheLayer=new CMLayerGraticule();
 TheLayer.SetSetting("Item","Name","Graticules");
 TheLayer.SetSetting("Border","BorderWidth",12);
 
 TheMainContainer.AddLayer(TheLayer);