PHPackages thelia/thelia-googlemap-module - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. thelia/thelia-googlemap-module ActiveThelia-module[Utility & Helpers](/categories/utility) thelia/thelia-googlemap-module ============================== 2.0.0(10mo ago)03342LGPL-3.0+JavaScript Since Apr 16Pushed 10mo ago7 watchersCompare [ Source](https://github.com/thelia-modules/TheliaGoogleMap)[ Packagist](https://packagist.org/packages/thelia/thelia-googlemap-module)[ RSS](/packages/thelia-thelia-googlemap-module/feed)WikiDiscussions master Synced 1mo ago READMEChangelog (10)Dependencies (1)Versions (13)Used By (0) Thelia Google Map ================= [](#thelia-google-map) author : Penalver Antony This module allow to integrate a google map with somes options. 1. Installation --------------- [](#1-installation) ### Manually [](#manually) - Copy the module into `/local/modules/` directory and be sure that the name of the module is TheliaGoogleMap. - Activate it in your thelia administration panel Warning : You need to configure your google api keys for google maps in configuration form before to use it. To get api key follow these instructions : ### Composer [](#composer) Add it in your main thelia composer.json file ``` composer require thelia/thelia-googlemap-module:~1.0 ``` 2. Usage -------- [](#2-usage) Use smarty function to integrate it in you template : {google\_map id="YOUR\_ID"}{/google\_map} Somes options are availables: OptionsTypeDescriptionDefaultclassStringAllow to change css classtheliagooglemapzoomIntegerAllow to change base map zoom0centerlatFloatUsed to set the latitude for base center map ( need centerLon to be set )0centerlonFloatUsed to set the longitude for base center map ( need centerLat to be set )0addressStringUsed to set the center point for mapnullcontrolBooleanUsed to disable default control UIfalsezoom-ctrlBooleanUsed to enable zoom control UItruepan-ctrlBooleanUsed to enable pan control UItruescale-ctrlBooleanUsed to enable scale control UItruemap-ctrlBooleanUsed to enable map type control UItruestreet-ctrlBooleanUsed to enable street view control UItrueoverview-ctrlBooleanUsed to enable overview control UIfalsemouse-ctrlBooleanUsed to enable mouse controlfalseshow-markerBooleanUsed to enable showing markerstruemarker-srcURLUsed to set an url source to show mutiples markersnullmarker-src-refreshBooleanUsed to refresh marker on map zoom or movefalsemarker-src-refresh-ttlIntegerTime in ms before triggering the URL to refresh markers100template-nameStringUsed to set a template on mapbasepin-linkURLUsed to set a custom pinnullshow-infoBooleanUsed to enable info window in maptrueclusterBooleanUsed to enable clustering for markersfalsecluster-options-callbackStringSet a callback function to define custom configuration for clustering{}geocoder-error-callbackStringUsed to set a callback function error handler for geocoder errorconsole logDeprecated options in favor of `cluster-options-callback` (since version 1.7) : OptionsTypeDescriptionDefaultcluster-grid-widthIntegerWidth size grid for cluster element10cluster-grid-heightIntegerHeight size grid for cluster element10pin-cluster-linkURLUsed to set a custom pin for cluster markernull3. Marker Source ---------------- [](#3-marker-source) To use marker source you need to respect a format. Json format : ``` { title : "TITLE MARKER", loc : [ "LATITUDE" ,"LONGITUDE" ], description : "DESCRIPTION", info : "SOME INFORMATIONS, link : "URL TO BIND BUTTON", link-label : "LABEL FOR BUTTOM" } ``` 4. Templating ------------- [](#4-templating) ### Template list [](#template-list) Some template are integrate by default : NameDescriptionKeyRedDemo template describe in google map documentation : redBlackTemplate black and white for classy mapblack### Create your own template [](#create-your-own-template) - 1. Create a js file - 2. Get theliaGoogleMapTemplate variable - 3. Insert your template like this: ``` "red": { "featureOpts": [ { stylers: [ {hue: '#890000'}, {visibility: 'simplified'}, {gamma: 0.5}, {weight: 0.5} ] }, { elementType: 'labels', stylers: [ {visibility: 'off'} ] }, { featureType: 'water', stylers: [ {color: '#890000'} ] } ], "styledMapOptions": { name: "Red Template" } }, ``` - 4. Insert your js file in `main.after-javascript-include` hook 5. Info Window -------------- [](#5-info-window) To customise info window you have to modify following css classes : - thelia-google-map-info-window - thelia-google-map-info - thelia-google-map-title - thelia-google-map-descp - thelia-google-map-link 6. Options ---------- [](#6-options) ### 6.1 Insert Google map js [](#61-insert-google-map-js) You can limitate Google Map API include to a particular Hook in module configuration. You just have to toggle configuration key and Google Map include script change binding from "main.after-javascript-include" to "theliagooglemap.front.insertjs". To insert the script in one page add the hook before main include javascript.` Hook to add : ``` {hook name="theliagooglemap.front.insertjs" modulecode="TheliaGoogleMap"} ``` ### 6.2 Example for geocoder-error-callback [](#62-example-for-geocoder-error-callback) ``` {google_map id="test-address" zoom=17 address="sdklgjodfh" geocoder-error-callback="callBackGeo"} function callBackGeo(status){ alert(status); } ``` ### 6.3 Example for cluster-options-callback [](#63-example-for-cluster-options-callback) To use custom cluster options, you have to use the `cluster-options-callback` like this : ``` {google_map id="test-address" zoom=14 address="sdklgjodfh" cluster="1" cluster-options-callback="clusterOptions"} function clusterOptions(status){ var clusterOptions = { gridSize: 60, styles: [ { url: "http:///mysite.com/frontOffice/default/assets/img/cluster-1.png", height: 46, width: 36, anchor: [10, 0], textColor: '#ffffff', textSize: 11 }, { url: 'http://mysite.com/frontOffice/default/assets/img/cluster2.png', height: 46, width: 36, anchor: [0, 0], textColor: '#ff0000', textSize: 15 } ] }; return clusterOptions; } ``` ### Health Score 40 — FairBetter than 88% of packages Maintenance53 Moderate activity, may be stable Popularity14 Limited adoption so far Community11 Small or concentrated contributor base Maturity70 Established project with proven stability Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~372 days Recently: every ~856 days Total 11 Last Release 325d ago Major Versions 1.7.0 → 2.0.02025-06-27 ### Community Maintainers ![](https://avatars.githubusercontent.com/u/2196919?v=4)[thelia](/maintainers/thelia)[@thelia](https://github.com/thelia) --- Top Contributors [![Soldras](https://avatars.githubusercontent.com/u/11573385?v=4)](https://github.com/Soldras "Soldras (42 commits)") ### Embed Badge ![Health badge](/badges/thelia-thelia-googlemap-module/health.svg) ``` [![Health](https://phpackages.com/badges/thelia-thelia-googlemap-module/health.svg)](https://phpackages.com/packages/thelia-thelia-googlemap-module) ``` PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)