is there a way to show only cities in a google map api autocomplete field?
At the moment we are using Geocode but unfortunately we receive even countries and addresses.
We even tried the following code
var input = document.getElementById('txt_city_and');
var options = {
types: ['(cities)']
};
autocomplete = new google.maps.places.Autocomplete(input, options);
and the error we receive is
Uncaught TypeError: Cannot read property 'Autocomplete' of undefined
--
Thank you
Please, ensure that
<script type="text/javascript" src="maps.google.com/maps/api/...
is placed before the script with the code that uses it
Related
I'm running some A/B tests with Google Optimize and am trying to just update a value in the dataLayer from my app but instead of updating it, it just adds a new object to it. According to the docs it should update if the key already exists.
Am I missing something?
For example:
// initiate dataLayer at the top of <head>
window.dataLayer = [{
message: ""
}];
// later after some stuff loaded
window.dataLayer.push({message: 'Test message'});
console.log(window.dataLayer) // added instead of updated
// [
// {message: ""},
// {message: "test"}
// ]
In short, and thanks to comment of #IskandarRezaRazali, it's working correctly but I should have been using window.google_tag_manager["GTM-XXXXXX"].dataLayer.get('message') (which will always give you the latest entry) to retrieve the value rather than trying to access it via index or having to do Array.find`.
Steven ,
Looks like you have missed the use of single quotes in your statement . In the documentation Google says
dataLayer.push({new-variable: 'value'}); // Won't work
instead
dataLayer.push({'new-variable': 'value'}); // Better
Look at the code below
<script>
dataLayer = [];
dataLayer.push({'message' : 'Test message'});
</script>
You can read the documentation here - https://developers.google.com/tag-manager/devguide
Just started integration of Salesforce Community with Universal Google Analytics (beginner in both).
Adding GA integration code in tag.
Downloaded GA debugger for Chrome.
Browser: Chrome.
Here is code in the tag:
<script>
(function(i,s,o,g,r,a,m)
{i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||
[]).push(arguments)},i[r].l=1*new Date
();a=s.createElement(o),m=s.getElementsByTagName(o)
[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})
(window,document,'script','https://www.google-
analytics.com/analytics_debug.js','ga');
window.ga_debug = {trace: true};
ga('create', 'UA-xxxxxxxxx-x', 'auto');
ga('send', 'pageview');
ga(function(tracker) {
tracker.set('sendHitTask', function(model) {
var hitPayload = model.get ( 'hitPayload' );
console.log ( 'models payload: ' + hitPayload );
// need this section to get user id value to send to dimension
//ga('set', 'dimension3', tracker.get('userId'));
});
});
</script>
Later in the code we make calls to track events.
After I've added
"ga(function(tracker) {" code section
those calls to track events do Not work any more (used to work).
What is wrong with the code above?
When you set the sendHitTask for the tracker, you're overriding it; that is, you're removing the normal task that sends data to Google Analytics and replacing it with your own. So, after you do this, any hits you track won't be sent to GA.
Instead, before you set the sendHitTask, you need to get the existing one and execute that function first in your new sendHitTask function.
From documentation for adding to a task, some code to do this follows. Before your tracker.set call, you need to add:
// Grab a reference to the default sendHitTask function.
var originalSendHitTask = tracker.get('sendHitTask');
Then, in your function that you're assigning to sendHitTask, you'll need to call that function:
// Send the normal request to Google Analytics
originalSendHitTask(model);
You have crippled your sendHitTask, because the method you provided to override it does not do any sending - you have replaced it with a function that logs something to the console and nothing else.
If you look at the example in the documentation you see that there they stored the original sendHitTask in a variable and called within the custom function.
Also you cannot use the ga object within the task, you access the properties of your tracker via the model that is passed in to the task.
So you would need something like
ga(function(tracker) {
// Grab a reference to the default sendHitTask function.
var originalSendHitTask = tracker.get('sendHitTask');
tracker.set('sendHitTask', function(model) {
model.set('dimension3',model.get('userId'));
originalSendHitTask(model);
});
});
Also you might consider to use the customTask to add custom behavior, although it will give the same result.
When using Google Places API, what is the best way of hiding the map itself ?
We only need the search auto-complete, and our users don't need to see the map itself.
https://developers.google.com/maps/documentation/javascript/places?authuser=2#place_search_requests
Got the answer from https://developers.google.com/maps/documentation/javascript/places-autocomplete?authuser=2#video
Basically the Autocomplete constructor has a constructor overload
= new google.maps.places.Autocomplete( htmlInput, autoCompleteOptions )
var autocomplete = new google.maps.places.Autocomplete(input, { bounds: defaultBounds });
And this is not violating the TOS at all, reading the https://developers.google.com/maps/documentation/javascript/places-autocomplete?authuser=2#video above.
I'm new to javascript and I'm working on a project which needs to google maps.
I need to use the text search function to find nearby veterinary request a postcode does not work and I have several questions.
Do I need an API key to use the service places?
I Copied the code documentation google maps but don't understand the callback function and i don't know if something I'm doing is wrong.
If anyone has any idea what's wrong with the code, I would greatly appreciate your response.
This is my code:
<script src="https://maps.googleapis.com/maps/api/js?callback=ini&sensor=false&libraries=places"></script>
<script type="text/javascript">
var map;
var vet= " veterinarys";
ini();
function ini()
{
var mapOptions =
{
center: new google.maps.LatLng(37.7831, -122.4039 ),
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map"), mapOptions);
var request =
{
radius: '500',
query: vet,
type: ['veterinary_care']
};
service = new google.maps.places.PlacesService(map);
service.textSearch(request, callback);
}
function callback(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
var place = results[i];
createMarker(results[i]);
}
}
}
</script>
API key is optional, but you have to pay attention to this note.
The Google Maps JavaScript API does not require an API key to function correctly. However, we strongly encourage you to load the Maps API using an APIs Console key which allows you to monitor your application's Maps API usage.
Callback parameter in the script URL is required if you load resource asynchronously. In that case as soon as Google Maps script will be loaded it will call your function. In your case to start use it you should add async attribute to the <script> tag and remove direct ini() function call from the code. Here you find documented explanation for callback param
Your code doesn't work because you specify radius param which requires location to be specified as well. It should work if you will add the same location to the request object as center param in mapOptions. Just check available options description.
You got the rest of the help from #Mihails Boturins's answer. I will answer for the question you asked in your last comment.
There is no such createMarker function defined in you code. You have to create that function just like this
I'm using Google Maps to get an autocomplete list of cities.
I used to use item.geometry.location.kb as the longitude and item.geometry.location.jb as the latitude, but they are not defined since today/yesterday.
Apparently, one has to use item.geometry.location.lng() and .lat() instead.
I didn't know that and I have an app using item.geometry.location.kb and jb in Google Play and the AppĀ Store.
So my apps are not working any more.
Why has a change has been made and how can I revert to kb and jb?
autocomplete = new google.maps.places.Autocomplete(input, options);
google.maps.event.addListener(autocomplete, 'place_changed', function(event) {
var item = autocomplete.getPlace();
curLon = item.geometry.location.kb;
curLat = item.geometry.location.jb;
// ...
Don't use undocumented properties of the Google APIs. They can and do change with every release.
geometry.location is a google.maps.LatLng object, and the documented methods to get latitude and longitude are .lat() and .lng().