--- title: "Users Manual" version: "main" permalink: "https://docs.typo3.org/permalink/clickstorm/go-maps-ext:user-manual@main" source: "User/Index.rst" rendered: "2026-10-20T15:14:12+00:00" --- # Users Manual {#user-manual} - The extension has to types of records: map and address. - A map can have a plurality of addresses. - Each frontend plug in includes one map. - The records can be saved on every page. Preferred is an extra SysFolder. - Each plugin requires one Map. img-4 ## Map {#map} One Map represents one Google Map in the frontend. img-5 The following table shows the main configurations of a map. Each description is also shown as help text when you hover the title of a field. - **Property** title - **Description** Will be used as ID (without space character, special character!). \[required\] - **Property** width - **Description** Set the width of the map. Default in px, for percentages enter '%', e.g. '100%'.\[required\] - **Property** height - **Description** Set the width of the map. Default in px, for percentages enter '%', e.g. '100%'.\[required\] - **Property** zoom - **Description** Only needed when the default zoom is wrong. Number between 0 and 23. 0 is the lowest zoom (whole world). - **Property** zoom min - **Description** The minimum zoom level which will be displayed on the map. If omitted, or set to null, the minimum zoom from the current map type is used instead. - **Property** zoom max - **Description** The maximum zoom level which will be displayed on the map. If omitted, or set to null, the maximum zoom from the current map type is used instead. - **Property** addresses - **Description** You can choose, create or edit an address. New addresses will be saved on the current page. - **Property** latitude - **Description** If set this latitude will be used to center the map. Otherwise the center is calculated so that all addresses fit in the map. - **Property** longitude - **Description** If set this longitude will be used to center the map. Otherwise the center is calculated so that all addresses fit in the map. - **Property** previewImage - **Description** Define an image to show as preview of the current map. Otherwise the fallback image of the TypoScript constant will be displayed if defined. If both is not set, a link will be displayed. - **Property** kmlUrl - **Description** Enter an URL of a KML file, e.g. [https://developers.google.com/maps/documentation/javascript/examples/kml/westcampus.kml](https://developers.google.com/maps/documentation/javascript/examples/kml/westcampus.kml) - **Property** kmlPreserveViewport - **Description** The viewport of the kml file will be ignored. Set zoom and at least one address to configure the viewport. - **Property** kmlLocal - **Description** The KML file is stored on this server. The specified path (kmlUrl) is relative. Only markers appear. Search and route are only available if the KML file is local. - **Property** defaultType - **Description** Map type on the beginning.MAP, SATELLITE, HYBRID, TERRAIN and one individual type are possible. - **Property** scrollZoom - **Description** Enables zoom with scroll wheel. - **Property** draggable - **Description** Position of the map can be changed. - **Property** doubleClickZoom - **Description** A double click on the map zooms in. Draggable map has to be enabled! - **Property** markerSearch - **Description** Displays a form on the frontend, were the user can enter a search word. Searchs for InfoWindow content and title of a marker. The InfoWindow of the first found marker opens. - **Property** showAddresses - **Description** Displays a list with all addresses incl. a link. If you click the selected address will be centered. - **Property** showCategories - **Description** Display a checkbox for each visible category. On change the points on the map will be enabled/disabled. - **Property** markerCluster - **Description** Many markers in the same region will be summarized and appear as a cluster. e.g.: http://google-maps-utility-library-v3.googlecode.com/s vn/trunk/markerclusterer/examples/advanced\\\_example.html - **Property** markerClusterZoom - **Description** Up to this zoom level the Clusters are displayed. Take a look at the example link above. - **Property** markerClusterSize - **Description** The size of the Clusters, like a radius. Take a look at the example link above. - **Property** scaleControl - **Description** Displays a measure. - **Property** streetviewControl - **Description** Shows an icon to enable the streetview. - **Property** fullscreenControl - **Description** Shows an icon to enable fullscreen. - **Property** zoomControl - **Description** Enable buttons to change the zoom. - **Property** mapTypeControl - **Description** Shows a control to change the map type. - **Property** mapTypes - **Description** Possible map types to choose. Map type control has to be enabled.MAP, SATELLITE, HYBRID, TERRAIN and one individual type are possible. - **Property** showRoute - **Description** 2 address records needed! Shows the route between the given points - **Property** calcRoute - **Description** Only 1 address used as destination. Display an text input for enter a starting point. You can configure the rendering by set the plugin.tx_gomapsext.view.layoutRoothPath, copy and edit the file Form.html. - **Property** travelMode - **Description** Select a travel mode or let the frontend user select one. - Select by Frontend User (Creates a select box in the frontend. You can configure the rendering by set the plugin.tx_gomapsext.view.layoutRoothPath, copy and edit the file Form.html.) - Bicycling (at the time only available in US) - Driving (Default) - Transit - Walking. You can configure the rendering by set the plugin.tx_gomapsext.view.layoutRoothPath, copy and edit the file Form.html. - **Property** UnitSystem - **Description** Select a unit system or let the frontend user select one. - Default (No fix value) - Select by Frontend User (Creates a select box in the frontend. You can configure the rendering by set the plugin.tx_gomapsext.view.layoutRoothPath, copy and edit the file Form.html.) - Metric (kilometer) - Imperial (miles). - **Property** styledMapName - **Description** Shown in the map type control. - **Property** styledMapCode - **Description** JSON, e.g. from [https://mapstyle.withgoogle.com/](https://mapstyle.withgoogle.com/) - **Property** markerClusterStyle - **Description** JSON code for the cluster style, for more information look here [https://github.com/googlemaps/js-markerclusterer](https://github.com/googlemaps/js-markerclusterer) ## Google Maps Address {#google-maps-address} A map represents addresses and/or a KML file. An address record mainly consists of longitude, latitude and the address itself which are configured via geocoding of the configuration map. img-6 Of course there are some more options... - **Property** title - **Description** Only for internal usage. \[required\] - **Property** configurationMap - **Description** Shown as Position. For geocoding the latitude, longitude and address. Enter an address \[street number, zip city\] or coordinates \[latitude, longitude\] and press 'Update' or drag and drop the marker in the map. - **Property** latitude - **Description** The latitude of the position. Configured via the position field. \[required\] - **Property** longitude - **Description** The longitude of the position. Configured via the position field.\[required\] - **Property** address - **Description** The address of the position. Configured via the position field.\[required\] - **Property** marker - **Description** A costum image for the pin. - **Property** imageSize - **Description** Check if the image of the marker has a different size then default. The image should be twice as large as indicated. - **Property** imageWidth - **Description** Costum image width in pixel. - **Property** imageHeight - **Description** Costum image height in pixel. - **Property** infoWindowContent - **Description** This will be displayed in the InfoWindow of this marker. - **Property** infoWindowImages - **Description** Extra field for fal images to show in the InfoWindow. - **Property** infoWindowLink - **Description** Attachs an optional automatic generated link to calculate a route on Google Maps. - **Property** openByClick - **Description** Open InfoWindow by click instead of mouse over. - **Property** closeByClick - **Description** Close InfoWindow by click instead of mouse out. - **Property** opened - **Description** The InfoWindow is opened when the map appears. For each map there will be only one opened InfoWindow. - **Property** categories - **Description** Each category can be selected via GET parameters or checkboxes. ## API Key {#api-key} An API Key is required for your Google Map. The integrator can set the API Key via TypoScript or an editor creates an API Key and set them in the FlexForm of the Plugin. - **Property** title - **Description** Only for internal usage. \[required\] - **Property** API Key - **Description** An API Key for Google Maps. More [information](http://googlegeodevelopers.blogspot.de/2016/06/building-for-scale-updates-to-google.html). Get your [apiKey](https://developers.google.com/maps/documentation/javascript/get-api-key).