How to display data correctly using php from a .js file

Hello Friends I have the following code:

// Infobox Output
        function locationData(locationURL, locationImg, locationTitle, locationAddress, locationRating, locationRatingCounter) {
            return ('' +
                '<a href="' + locationURL + '" class="listing-img-container">' +
                '<div class="infoBox-close"><i class="fa fa-times"></i></div>' +
                '<img src="' + locationImg + '" alt="">' +

                '<div class="listing-item-content">' +
                '<h3>' + locationTitle + '</h3>' +
                '<span>' + locationAddress + '</span>' +
                '</div>' +

                '</a>' +

                '<div class="listing-content">' +
                '<div class="listing-title">' +
                '<div class="' + infoBox_ratingType + '" data-rating="' + locationRating + '"><div class="rating-counter">(' + locationRatingCounter + ' reviews)</div></div>' +
                '</div>' +
                '</div>')
        }

I use this code to show when I click on a pop-up window on my Google map.

the following code:

// Locations
        var locations = [
            [locationData('page1.html', '../../assets/images/listing-item-01.jpg', "Tom's Restaurant", '964 School Street, New York', '3.5', '12'), 18.4681399, -69.9339234, 1, '<i class="im im-icon-Chef-Hat"></i>'],
            [locationData('page1.html', '../../assets/images/listing-item-02.jpg', 'Sticky Band', 'Bishop Avenue, New York', '5.0', '23'), 18.4813367, -69.9056478, 2, '<i class="im im-icon-Electric-Guitar"></i>'],
            [locationData('page1.html', '../../assets/images/listing-item-03.jpg', 'Hotel Govendor', '778 Country Street, New York', '2.0', '17'), 18.5137181, -69.8791685, 3, '<i class="im im-icon-Home-2"></i>'],
            [locationData('page1.html', '../../assets/images/listing-item-04.jpg', 'Burger House', '2726 Shinn Street, New York', '5.0', '31'), 18.5169269, -69.8744688, 4, '<i class="im im-icon-Hamburger"></i>'],
            [locationData('page1.html', '../../assets/images/listing-item-05.jpg', 'Airport', '1512 Duncan Avenue, New York', '3.5', '46'), 18.5235546, -69.8672669, 5, '<i class="im im-icon-Plane"></i>'],
            [locationData('page1.html', '../../assets/images/listing-item-06.jpg', 'Think Coffee', '215 Terry Lane, New York', '4.5', '15'), 18.5296664, -69.8633336, 6, '<i class="im im-icon-Coffee"></i>'],
            [locationData('page1.html', '../../assets/images/listing-item-04.jpg', 'Burger House', '2726 Shinn Street, New York', '5.0', '31'), 18.8288595, -70.2976137, 7, '<i class="im im-icon-Hamburger"></i>'],
            [locationData('page1.html', '../../assets/images/listing-item-04.jpg', 'Burger House', '2726 Shinn Street, New York', '5.0', '31'), 18.5235546, -69.8791685, 7, '<i class="im im-icon-Hamburger"></i>'],
            [locationData('page1.html', '../../assets/images/listing-item-04.jpg', 'Burger House', '2726 Shinn Street, New York', '5.0', '31'), 18.4681399, -70.2976137, 7, '<i class="im im-icon-Hamburger"></i>'],
        ];

I use it to show the different locations on the map.

I used this code but it does not show me anything

var locations = new XMLHttpRequest();
    locations.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            document.getElementById("map").innerHTML = this.responseText;
        }
    };
    locations.open("GET", "locations.php", true);

for the file "locations.php" I made an echo to test, but I did not get the result

 echo "
        [locationData('page1.html', '../../assets/images/listing-item-01.jpg', 'Tom's Restaurant', '964 School Street, New York', '3.5', '12'), 18.4681399, -69.9339234, 1, '<i class='im im-icon-Chef-Hat'></i>'],
        [locationData('page1.html', '../../assets/images/listing-item-02.jpg', 'Sticky Band', 'Bishop Avenue, New York', '5.0', '23'), 18.4813367, -69.9056478, 2, '<i class='im im-icon-Electric-Guitar'></i>'],
        [locationData('page1.html', '../../assets/images/listing-item-03.jpg', 'Hotel Govendor', '778 Country Street, New York', '2.0', '17'), 18.5137181, -69.8791685, 3, '<i class='im im-icon-Home-2'></i>'],
        [locationData('page1.html', '../../assets/images/listing-item-04.jpg', 'Burger House', '2726 Shinn Street, New York', '5.0', '31'), 18.5169269, -69.8744688, 4, '<i class='im im-icon-Hamburger'></i>'],
        [locationData('page1.html', '../../assets/images/listing-item-05.jpg', 'Airport', '1512 Duncan Avenue, New York', '3.5', '46'), 18.5235546, -69.8672669, 5, '<i class='im im-icon-Plane'></i>'],
        [locationData('page1.html', '../../assets/images/listing-item-06.jpg', 'Think Coffee', '215 Terry Lane, New York', '4.5', '15'), 18.5296664, -69.8633336, 6, '<i class='im im-icon-Coffee'></i>'],
        [locationData('page1.html', '../../assets/images/listing-item-04.jpg', 'Burger House', '2726 Shinn Street, New York', '5.0', '31'), 18.8288595, -70.2976137, 7, '<i class='im im-icon-Hamburger'></i>'],
        [locationData('page1.html', '../../assets/images/listing-item-04.jpg', 'Burger House', '2726 Shinn Street, New York', '5.0', '31'), 18.5235546, -69.8791685, 7, '<i class='im im-icon-Hamburger'></i>'],
        [locationData('page1.html', '../../assets/images/listing-item-04.jpg', 'Burger House', '2726 Shinn Street, New York', '5.0', '31'), 18.4681399, -70.2976137, 7, '<i class='im im-icon-Hamburger'></i>']";

Any suggestions?

Thank you very much