Each month, an NN4D technical specialist will answer popular questions on map development. This month Abhijit Deshpande, senior solutions engineer, answers the following question:
Q: How do I create concentric circles on a specific location on a map?
A: Concentric circles on a map work as a visual aid in focusing a user’s attention on a specific location of the map. They are useful to ‘zero down’ on a specific location such as a restaurant, monument or street and look similar to a bull’s eye view.
The first method to add one to a map involves inserting an animated GIF of a bull’s eye (or any other GIF or image asset) in a specific location that has the advantage of visibility at any zoom level.
The second method is programmatic and the concentric circles are not visible until a certain zoom level is reached. A developer can be more creative with colors, zoom levels and border widths in this method and dynamically change it based on an event.
Method 1: Add an animated GIF file at a specific location:
The code is as follows:
myLoc = new Map24.Location({
Longitude: “597.3”,
Latitude: “3213.0068”,
LogoURL: “http://path.to.image.asset/ asset.gif”
});
myLoc.commit();
myLoc.show();
Method 2: Create an oval with carefully adjusted color, border width and border color.
The code is as follows:
myOval = new Map24.Oval({
Longitude: “597.3”,
Latitude: “3213.0068”,
Width: 300,
Height: 300,
FillColor: [“FFFFF0”, 75]
});
myOval.setBorderColor(“0000FF”);
myOval.setBorderWidth(50);
myOval.commit();
myOval.center({ MinimumWidth: 2500 });
myOval.show();
This is how it looks:
