Category: API Code

Introduction: In this tutorial, we will see the control options available in Google Maps. Several controls are customizable, enabling you to modify their function or look. For example, the Map Type control may look as a horizontal bar or a dropdown menu. When the map is created, these controls are modified by changing the appropriate […]

Introduction: In this tutorial, we will learn how to replace the default Google Map setting with the custom settings. Several map controls may be customised. Control options fields can be used to customise the controls. The zoomControlOptions field, for example, specifies choices for customising a Zoom control. The zoomControlOptions field may have the following values: […]

Introduction: In this tutorial we will see how the custom positioning of the Map is controlled. Most control choices have a position property (of type ControlPosition) that determines where the control should be placed on the map. The placement of these controls is not definite. Instead, the API will automatically arrange up the controls by […]

Introduction: In this tutorial, we will see the custom controls in Google Map API. You may develop your own controls to manage user interaction in addition to altering the design and location of existing API components. In contrast to overlays, which move with the underlying map, controls are immobile widgets that float on top of […]

Introduction: In this tutorial, we will learn how to add the state to the controls. This example shows how to build controls that save state. It displays a map with two buttons labelled “Set Center” and “Center Map.” The “Set Center” button may be used to save the map’s centre. When you press the “Center […]

Introduction: In this tutorial we will learn how to create a map by disabling the default settings of map creation. Below given example, creates a map with the default UI controls disabled (for example, it has no zoom controls or Street View icon). You might want to disable the API’s default UI buttons completely. Set […]

Introduction: In this tutorial, we will see how to restrict the Map bounds in Google Maps. This example generates a map beginning in Auckland, New Zealand. The map only shows New Zealand. The user may move away from Auckland and explore other New Zealand cities, but they cannot pan or zoom beyond the map’s boundaries. […]

Introduction: In this tutorial, we will learn how to create a map with the help of default controls available in Google Maps. Code: function initMap(): void { const map = new google.maps.Map( document.getElementById(“map”) as HTMLElement, { center: { lat: -34.397, lng: 150.644 }, zoom: 8, } ); } declare global { interface Window { initMap: […]

Introduction: In this tutorial we will learn how to create a map which displays a window with the latitude, longitude, and world, pixel, and tile coordinates for Chicago, IL. Also, we will  show how these values change as the zoom level is adjusted. Code: function initMap(): void { const chicago = new google.maps.LatLng(41.85, -87.65); const […]

Introduction: The Geolocation API gives a location and accuracy radius based on cell tower and WiFi node information detected by the mobile client. The protocol used to deliver this data to the server and return a response to the client is described in this document. POST is used for HTTPS communication. Both the request and […]