Google Maps Add Circle

I have attached a modified GoogleMaps sample. It shows two ways to do that. In general, with Wisej integrated widgets you can use any javascript api from the original widget. In this case this is the api for circles: https://developers.google.com/maps/documentation/javascript/examples/circle-simple

You can write javascript code that adds the circles and call it from Wisej, or you can add api methods to the Wisej widget either by modifying the google map extension or from your code. The sample app has a .js file that adds two methods to the google maps wisej widget: addTestCircles (copied from the api linked above) and a generic addCircle.

Using the sample, click the AddCircles button.

Remember that google maps (in general all third party javascript widgets) do not keep any state so if you refresh the page anything you set is lost and has to be reapplied.

this.googleMap1.Call("addTestCircles");

this.googleMap1.Call("addCircle", new {
 strokeColor = "#00FF00",
 strokeOpacity= 0.8,
 strokeWeight= 2,
 fillColor= "#00FF00",
 fillOpacity= 0.35,
 center= new { lat= 41.878, lng= -87.629 }, // Chicago
 radius= Math.Sqrt(2714856) * 100 // Population
 });