Google Maps in Quasar, google is not defined?



  • I’m using Google Maps to create a Location next to some store addresses that I have in my database.

    Google recommends creating a table like this:

    0_1531155771384_5bdf216f-11c8-4400-8c93-6f2e44c68380-image.png

    This table should be populated with name, address, latitude and longitude information for the locations of your store/company.

    Recommend that your bank SELECT be as below. To a calculation that searches for the distance between one address and another.

    Note: The select below search for miles, to search for kilometers you must change the number 3959 to6371.

    SELECT id, ( 3959 * acos( cos( radians(37) ) * cos( radians( lat ) ) * cos( radians( lng ) - radians(-122) ) + sin( radians(37) ) * sin( radians( lat ) ) ) ) AS distance FROM markers HAVING distance < 25 ORDER BY distance LIMIT 0 , 20;

    In the documentation the following methods are required for this purpose.

    searchLocations: Turn user search (typed text) into latitude and longitude.
    searchLocationsNear: Send a request to the Back-End to find the nearest places.

    downloadUrl: Download anXML with the information about the nearest places.

    I even understood how I should proceed.

    My problem is that the methods that Google makes available have the following error at compile time.

    Error:

    google is not defined

    This error happens in methods that have new google.maps, exemple:

    searchLocations: function searchLocations () {
    var address = this.search
    var geocoder = new google.maps.Geocoder()
    geocoder.geocode({address: address}, function (results, status) {
    if (status === google.maps.GeocoderStatus.OK) {
    this.searchLocationsNear(results[0].geometry.location)
    } else {
    alert(address + ’ not found’)
    }
    })
    }


  • Admin

    Have you added the Google script tags in your src/index.template.html?
    There are also some websites/apps submitted to quasar-awesome repo which use Google Maps – some with source code. Check them out.