Drawing on the Map Stay organized with collections Save and categorize content based on your preferences.
AI-generated Key Takeaways
The Maps JavaScript API uses objects calledoverlays to designate points, lines, areas, or collections of objects on the map, which are tied to latitude/longitude coordinates.
You can add various overlay types to your map, including info windows, polylines, polygons, circles, rectangles, symbols, ground overlays, and even create custom overlays.
The Drawing Library allows users to interactively draw shapes like polylines, polygons, and markers directly on the map.
Geocoding enables easy retrieval of latitude and longitude coordinates for places and addresses through requests.
Customize the appearance of markers and polylines by using symbols, which are vector-based images defined using SVG path notation.
You can add objects to the map to designate points, lines, areas, or collections of objects. The Maps JavaScript API calls these objectsoverlays. Overlays are tied to latitude/longitude coordinates, so they move when you drag or zoom the map.
Drawing Library: If you want to allow your users to draw on the map, please refer to theDrawing Library documentation. With the tools available in the Drawing Library, you can provide a graphical interface that lets people draw polylines, polygons and markers on the map.Geocoding: Retrieving latitudes and longitudes for a Place or a street address is easily done with aGeocoding request. It will return a list of responses, each including aLatLng.Overlay types
The Maps JavaScript API has several types of overlays that you can add programmatically:
- Aninfo window is a special kind of overlay for displaying content (usually text or images) within a popup balloon at a given location on a map. SeeInfo Windows.
- Lines on the map are displayed usingpolylines representing an ordered sequence of locations. SeeShapes and lines.
- Areas of arbitrary shape on the map are displayed usingpolygons. Like polylines, polygons are an ordered sequence of locations. Unlike polylines, polygons define a region which they enclose. SeeShapes and lines.
- You can also definecircles andrectangles on the map.
- Use asymbol to customize the icon on a marker or add images to a polyline. A symbol is a vector-based image defined by a path, using SVG path notation. The API also provides options to control how the symbol will be displayed. SeeSymbols.
- If you want to place an image on a map, you can use aground overlay. SeeGround Overlays.
- You may also implement your owncustom overlays by implementing the
OverlayViewinterface. SeeCustom Overlays. - Map layers may be displayed usingoverlay map types. You can create your own set of tiles by creating custom map types which either replace base map tile sets, or appear on top of existing base map tile sets as overlays. See Custom Map Types.
Except as otherwise noted, the content of this page is licensed under theCreative Commons Attribution 4.0 License, and code samples are licensed under theApache 2.0 License. For details, see theGoogle Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.
Last updated 2025-11-21 UTC.