javascript - Googleマップの緯度/経度から個々の投稿Djangoへのハイパーリンクを作成しようとしています

Question

現在、Google マップに現在表示されている投稿へのハイパーリンクを作成しようとしています。マップには、緯度と経度に基づいて各投稿が表示されます。以下のコードは各投稿のタイトルにリンクしていますが、問題は、タイトルが大文字であるか、スペースが含まれていることが多いことです。ここに私が持っているものがあります:

`

    <div class="court-listing" id="map-canvas"></div>

    <script>
        function initialize() {
            var map = new google.maps.Map(document.getElementById('map-canvas'), {
      center: {lat: 40.674, lng: -73.945},
      zoom: 12,
      styles: [
        {elementType: 'geometry', stylers: [{color: '#242f3e'}]},
        {elementType: 'labels.text.stroke', stylers: [{color: '#242f3e'}]},
        {elementType: 'labels.text.fill', stylers: [{color: '#746855'}]},
        {
          featureType: 'administrative.locality',
          elementType: 'labels.text.fill',
          stylers: [{color: '#d59563'}]
        },
        {
          featureType: 'poi',
          elementType: 'labels.text.fill',
          stylers: [{color: '#d59563'}]
        },
        {
          featureType: 'poi.park',
          elementType: 'geometry',
          stylers: [{color: '#263c3f'}]
        },
        {
          featureType: 'poi.park',
          elementType: 'labels.text.fill',
          stylers: [{color: '#6b9a76'}]
        },
        {
          featureType: 'road',
          elementType: 'geometry',
          stylers: [{color: '#38414e'}]
        },
        {
          featureType: 'road',
          elementType: 'geometry.stroke',
          stylers: [{color: '#212a37'}]
        },
        {
          featureType: 'road',
          elementType: 'labels.text.fill',
          stylers: [{color: '#9ca5b3'}]
        },
        {
          featureType: 'road.highway',
          elementType: 'geometry',
          stylers: [{color: '#746855'}]
        },
        {
          featureType: 'road.highway',
          elementType: 'geometry.stroke',
          stylers: [{color: '#1f2835'}]
        },
        {
          featureType: 'road.highway',
          elementType: 'labels.text.fill',
          stylers: [{color: '#f3d19c'}]
        },
        {
          featureType: 'transit',
          elementType: 'geometry',
          stylers: [{color: '#2f3948'}]
        },
        {
          featureType: 'transit.station',
          elementType: 'labels.text.fill',
          stylers: [{color: '#d59563'}]
        },
        {
          featureType: 'water',
          elementType: 'geometry',
          stylers: [{color: '#17263c'}]
        },
        {
          featureType: 'water',
          elementType: 'labels.text.fill',
          stylers: [{color: '#515c6d'}]
        },
        {
          featureType: 'water',
          elementType: 'labels.text.stroke',
          stylers: [{color: '#17263c'}]
        }
      ]
    });
            var bounds = new google.maps.LatLngBounds();
            function addMarker(lat, lng, title) {
                var location = new google.maps.LatLng(lat, lng);
                var marker = new google.maps.Marker({
                    position: location,
                    map: map,
                    title: title
                });
            var infowindow = new google.maps.InfoWindow({
      content: '<a href="' + marker.getTitle() + '">' + marker.getTitle() + '</a>'
    });
    google.maps.event.addListener(marker, 'click', function() {
      infowindow.open(map, marker);
    });
                bounds.extend(location);
            }
             {% for obj in object_list %}
                 addMarker({{ obj.location.latitude }}, {{ obj.location.longitude }}, "{{ obj.title }}");

            {% endfor %}

            map.fitBounds(bounds);

        }
        google.maps.event.addDomListener(window, 'load', initialize);
    </script> `

これは、各投稿にリンクするためにモデルで定義したものです。

{{ obj.get_absolute_url }}

これを infoWindow に含める簡単な方法はありますか? どうにかしてマーカー配列に収まる必要があると思いますが、うまく追加できませんでした。

前もってお詫び申し上げます。私は Django の初心者です...これは、Rails の方がはるかに簡単なようです。

どんなヒントも素晴らしいでしょう。