Last active
April 2, 2018 22:27
-
-
Save Jiab77/0f1bf31cc4555ce932ede965bca3c215 to your computer and use it in GitHub Desktop.
GoogleMaps - Places API Types Icons
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| 'use strict'; | |
| // GoogleMaps - Places API Types Icons | |
| // Used google documentation and some tricks from stackoverflow | |
| // Commented types are types from the documentation which not returning icon | |
| // Some types are coming from the stackoverflow answer | |
| // (c) 2018 - Jonathan Barda <jonathan.barda@gmail.com> | |
| // https://gist.github.com/Jiab77/0f1bf31cc4555ce932ede965bca3c215 | |
| // Links: | |
| // https://developers.google.com/places/supported_types | |
| // https://stackoverflow.com/questions/29516892/google-places-api-icons-list | |
| // https://stackoverflow.com/a/35457634 | |
| // https://stackoverflow.com/a/44957501 | |
| var icons = [ | |
| // 'accounting', | |
| // 'administrative_area_level_1', | |
| // 'administrative_area_level_2', | |
| // 'administrative_area_level_3', | |
| // 'administrative_area_level_4', | |
| // 'administrative_area_level_5', | |
| 'airport', | |
| 'amusement', | |
| // 'amusement_park', | |
| 'aquarium', | |
| 'art_gallery', | |
| 'atm', | |
| 'baby', | |
| // 'bakery', | |
| // 'bank', | |
| 'bank_dollar', | |
| 'bank_euro', | |
| 'bank_pound', | |
| 'bank_yen', | |
| 'bar', | |
| 'barber', | |
| 'baseball', | |
| 'beach', | |
| // 'beauty_salon', | |
| 'bicycle', | |
| // 'bicycle_store', | |
| // 'book_store', | |
| 'bowling', | |
| // 'bowling_alley', | |
| 'bus', | |
| // 'bus_station', | |
| 'cafe', | |
| // 'campground', | |
| 'camping', | |
| 'car_dealer', | |
| 'car_rental', | |
| 'car_repair', | |
| // 'car_wash', | |
| 'casino', | |
| // 'cemetery', | |
| // 'church', | |
| // 'city_hall', | |
| 'civic_building', | |
| // 'clothing_store', | |
| // 'colloquial_area', | |
| 'convenience', | |
| // 'convenience_store', | |
| // 'country', | |
| 'courthouse', | |
| 'dentist', | |
| // 'department_store', | |
| 'doctor', | |
| // 'electrician', | |
| 'electronics', | |
| // 'electronics_store', | |
| // 'embassy', | |
| // 'establishment', | |
| // 'finance', | |
| // 'fire_station', | |
| 'fitness', | |
| // 'florist', | |
| // 'floor', | |
| 'flower', | |
| // 'food', | |
| // 'funeral_home', | |
| // 'furniture_store', | |
| 'gas_station', | |
| // 'general_contractor', | |
| 'generic_business', | |
| 'generic_recreational', | |
| 'geocode', | |
| 'golf', | |
| 'government', | |
| // 'gym', | |
| // 'hair_care', | |
| // 'hardware_store', | |
| // 'health', | |
| // 'hindu_temple', | |
| 'historic', | |
| // 'home_goods_store', | |
| // 'hospital', | |
| // 'insurance_agency', | |
| // 'intersection', | |
| 'jewelry', | |
| // 'jewelry_store', | |
| // 'laundry', | |
| // 'lawyer', | |
| 'library', | |
| // 'liquor_store', | |
| // 'local_government_office', | |
| // 'locality', | |
| // 'locksmith', | |
| 'lodging', | |
| // 'meal_delivery', | |
| // 'meal_takeaway', | |
| 'monument', | |
| // 'mosque', | |
| 'mountain', | |
| // 'movie_rental', | |
| // 'movie_theater', | |
| // 'moving_company', | |
| 'movies', | |
| 'museum', | |
| // 'natural_feature', | |
| // 'neighborhood', | |
| // 'night_club', | |
| // 'painter', | |
| // 'park', | |
| // 'parking', | |
| 'pet', | |
| // 'pet_store', | |
| // 'pharmacy', | |
| // 'physiotherapist', | |
| // 'place_of_worship', | |
| // 'plumber', | |
| // 'point_of_interest', | |
| 'police', | |
| // 'political', | |
| // 'post_box', | |
| 'post_office', | |
| // 'postal_code', | |
| // 'postal_code_prefix', | |
| // 'postal_code_suffix', | |
| // 'postal_town', | |
| // 'premise', | |
| // 'real_estate_agency', | |
| 'repair', | |
| 'restaurant', | |
| // 'roofing_contractor', | |
| // 'room', | |
| // 'route', | |
| // 'rv_park', | |
| 'school', | |
| // 'shoe_store', | |
| 'shopping', | |
| // 'shopping_mall', | |
| 'ski', | |
| // 'spa', | |
| 'stadium', | |
| // 'storage', | |
| // 'store', | |
| // 'street_address', | |
| // 'street_number', | |
| // 'sublocality', | |
| // 'sublocality_level_1', | |
| // 'sublocality_level_2', | |
| // 'sublocality_level_3', | |
| // 'sublocality_level_4', | |
| // 'sublocality_level_5', | |
| // 'subpremise', | |
| // 'subway_station', | |
| 'supermarket', | |
| // 'synagogue', | |
| 'taxi', | |
| // 'taxi_stand', | |
| 'tennis', | |
| 'train', | |
| // 'train_station', | |
| // 'transit_station', | |
| // 'travel_agency', | |
| 'travel_agent', | |
| 'truck', | |
| 'university', | |
| // 'veterinary_care', | |
| 'wine', | |
| 'worship_christian', | |
| 'worship_general', | |
| 'worship_hindu', | |
| 'worship_islam', | |
| 'worship_jewish', | |
| 'zoo' | |
| ]; | |
| icons.__proto__.toConsole = function () { | |
| // jQuery | |
| // Return the array after execution | |
| // $.each(icons, function (index, value) { | |
| // console.log('%c ', 'font-size: 71px; background: url(https://maps.gstatic.com/mapfiles/place_api/icons/' + value + '-71.png) no-repeat;', value); | |
| // }); | |
| // VanillaJS - ES5 | |
| // Does not return the array after execution | |
| for (var i = 0; i < icons.length; i++) { | |
| var icon = icons[i]; | |
| console.log('%c ', 'font-size: 71px; background: url(https://maps.gstatic.com/mapfiles/place_api/icons/' + icon + '-71.png) no-repeat;', icon); | |
| } | |
| // VanillaJS - ES6 | |
| // Does not return the array after execution | |
| // for (let i = 0; i < icons.length; i++) { | |
| // const icon = icons[i]; | |
| // console.log('%c ', 'font-size: 71px; background: url(https://maps.gstatic.com/mapfiles/place_api/icons/' + icon + '-71.png) no-repeat;', icon); | |
| // } | |
| } | |
| icons.__proto__.toImageTag = function (wanted_icon) { | |
| // jQuery | |
| // Return the array after execution | |
| // $.each(icons, function (index, value) { | |
| // var found_icon; | |
| // if (wanted_icon && value === wanted_icon) { | |
| // found_icon = '<img src="https://maps.gstatic.com/mapfiles/place_api/icons/' + value + '-71.png" alt="' + value + '-71.png" />'; | |
| // } | |
| // if (typeof found_icon !== 'undefined') return found_icon; | |
| // }); | |
| // VanillaJS - ES5 | |
| // Does not return the array after execution | |
| for (var i = 0; i < icons.length; i++) { | |
| var icon = icons[i], found_icon; | |
| if (wanted_icon && icon === wanted_icon) { | |
| found_icon = '<img src="https://maps.gstatic.com/mapfiles/place_api/icons/' + icon + '-71.png" alt="' + icon + '-71.png" />'; | |
| } | |
| if (typeof found_icon !== 'undefined') return found_icon; | |
| } | |
| // VanillaJS - ES6 | |
| // Does not return the array after execution | |
| // for (let i = 0; i < icons.length; i++) { | |
| // const icon = icons[i]; | |
| // let found_icon; | |
| // if (wanted_icon && icon === wanted_icon) { | |
| // found_icon = '<img src="https://maps.gstatic.com/mapfiles/place_api/icons/' + icon + '-71.png" alt="' + icon + '-71.png" />'; | |
| // } | |
| // if (typeof found_icon !== 'undefined') return found_icon; | |
| // } | |
| } | |
| icons.__proto__.toURL = function (wanted_icon) { | |
| // jQuery | |
| // Return the array after execution | |
| // $.each(icons, function (index, value) { | |
| // var found_icon; | |
| // if (wanted_icon && value === wanted_icon) { | |
| // found_icon = 'https://maps.gstatic.com/mapfiles/place_api/icons/' + value + '-71.png'; | |
| // } | |
| // if (typeof found_icon !== 'undefined') return found_icon; | |
| // }); | |
| // VanillaJS - ES5 | |
| // Does not return the array after execution | |
| for (var i = 0; i < icons.length; i++) { | |
| var icon = icons[i], found_icon; | |
| if (wanted_icon && icon === wanted_icon) { | |
| found_icon = 'https://maps.gstatic.com/mapfiles/place_api/icons/' + icon + '-71.png'; | |
| } | |
| if (typeof found_icon !== 'undefined') return found_icon; | |
| } | |
| // VanillaJS - ES6 | |
| // Does not return the array after execution | |
| // for (let i = 0; i < icons.length; i++) { | |
| // const icon = icons[i]; | |
| // let found_icon; | |
| // if (wanted_icon && icon === wanted_icon) { | |
| // found_icon = 'https://maps.gstatic.com/mapfiles/place_api/icons/' + icon + '-71.png'; | |
| // } | |
| // if (typeof found_icon !== 'undefined') return found_icon; | |
| // } | |
| } |
For those who want to know what -71.png stands for, it related to the pixel size of the icon 😎
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
To interested peoples
Feel free to contribute by adding functions to the prototype like this:
I tried to provide three alternatives as Javascript code:
Have fun!
Jiab77