Map Your Lawn Webapp
Simple GeoJSON editor with freehand drawing 

Look up your property, mark out areas and cut off all unnecessary to have your area in feet, yards, meters and others. You can also open and add GeoJSON shapes to the map from your local computer or with a direct link to a Web resource. Save the result as GeoJSON for future reference (with a subscription). Try our Map Your Lawn webapp today! See our Privacy Policy.

Important note! Until the issue with using a google script app in a multiuser environment (signed-in in one session) is resolved, use this web app with one only signed-in Google account. You can also use it in the private mode tab.

For developers:

Embed this app into your site with your own Google Maps API Key with enabled Maps JavaScript API. You can customize the appearance of the map and use callback functions to integrate it with your page or application.

How to use

1. Search for your plot of land using the Location Search control with autocomplete.

2. Choose the right tool for plotting the boundaries of the land
   polygon,
   rectangle,
   circle,
   freehand drawing.
   
   

3. Use layers mode control to
   union,
   subtract,
   use multiple layers.
   To turn multiple layers mode ON use
   - Alt+Click on desktop devices,
   - “Press and Hold” on mobile devices.
   
   Important note! Overlapping shapes will be merged after turning multiple layers mode OFF or opening/adding shapes from file
   
   

4. The Area of the shapes area will be calculated and displayed:
   
   Click on the area units and select the ones you want from the list to change.
   
   

5. Click menu Save to save created shapes in GeoJSON format (with a subscription).

Open

Click menu Open to open GeoJSON map.

Add

Click menu Add to add GeoJSON shapes to your map.

Add from url

Click menu Add to add GeoJSON shapes to your map from the direct link to a Web resource.

Flip lat/lng

Click menu Flip lat/lng to change the order of latitude and longitude coordinates of your GeoJSON shape.

Clear

Click menu Clear to remove all shapes from the map.

Save selected

Click menu Save selected to save selected shapes.

Save all

Click menu Save all to save all shapes.

Subscription

Check the subscription status of this web application in the Subscription menu.

Click button to add a new subscription.

There are 2 types of subscription:

‘Lawn Map’ is an individual user subscription that does not require a Google Maps API key;

‘Lawn Map Pro’ is a developer subscription that requires the developer's own Google Maps API key.

Information for developers

To embed this app into your site

1. Create your own Google Maps API Key  with enabled Maps JavaScript API.

2. Use the following code:
   <script src="https://script.google.com/macros/s/AKfycbxdtrzoHA01oTXvyayAZGlnNUrQQiB2R4fQGzjOoJEfwcvPn9_5zQQ83WSeCreloDXs/exec?GOOGLE_KEY=[YOUR GOOGLE MAPS API KEY]&other_parameter=other_parameter_value"></script>
   <script>
   window.onload = MYL.init;
   </script>

3. You can customize the appearance of the map and use callback functions to integrate it with your page or application with the following parameters:
   GOOGLE_KEY Your Google Maps API Key  with enabled Maps JavaScript API (required)
   container The map will render to fill this element. If this parameter is missing, a new item will be created
   title Set window title
   map_mode Set initial map mode. Allowed values: roadmap, satellite (default), hybrid, terrain
   layers_mode Set initial layers mode. Allowed values: add (default), remove, layers
   units Set initial area measurement units. Allowed values: ft (default), yd, ac, mi, m, ha, km
   tools Enable the following tools. Allowed values: marker, circle, rectangle, polygon, polyline, freehand, mode, menu
   drawing_mode Set default tool to use
   controls UI controls to show. Allowed values: area, enter_location, geocode
   region Set a default bias. The region parameter accepts Unicode region subtag identifiers
   language Display map information in a particular language. See the list of supported languages
   center The initial Map center: latitude, longitude. See the example: -34.397,150.644
   zoom The initial Map zoom level. Valid values: Integers between zero, and up to the supported maximum zoom level
   minZoom The minimum zoom level which will be displayed on the map
   maxZoom The maximum zoom level which will be displayed on the map
   geojson GeoJSON shapes to display: JSON data
   geojson_url GeoJSON shapes to display: direct URL to GeoJSON file
   buttons Action buttons to display. Allowed properties: ‘text’ - materialize CSS icon to display, title - button title, handler - callback function to call on action.
   See the example: {text:"done",title:"Submit","background-color":"#26a69a",handler:"submitAction"}

To publish customized webapp with Google user authorization in a frame, use the following code:

<iframe src="https://script.google.com/macros/s/AKfycbzX97Ypt9TBAOwyGc-tePv7ntPt8-Uhhd5UdautbYD37hW_gS8/exec?GOOGLE_KEY=[YOUR GOOGLE MAPS API KEY]&other_parameter=other_parameter_value"></iframe>

Important security notes! 

Follow Google recommendations to protect your Google Maps API key  

- for the webapp directly embedded into your site apply HTTP referrer and specify the following pages as allowed referrers: https://your_site_url/*

- for the webapp embedded into your site in a frame apply HTTP referrers and specify the following pages as allowed referrers:

https://n-dvso33wqzfmcutsd6vwx62nzvrkfcsoybhutiiy-0lu-script.googleusercontent.com/*
https://n-dvso33wqzfmcutsd6vwx62nzvrkfcsoybhutiiy-1lu-script.googleusercontent.com/*
https://n-dvso33wqzfmcutsd6vwx62nzvrkfcsoybhutiiy-2lu-script.googleusercontent.com/*

(if the address changes later, look for the updated URL in the web browser developer console).