谷歌地圖 API V3 - Javascript 問題

Question

我已經使用 api V3 創建了一個嵌入 Google 地圖的站點，它顯示了我們的 4 個辦公室，然后您可以輸入您的郵政編碼並檢查您與辦公室之間的距離，這很有效！

我現在想創建一個徑向搜索，我已經找到了如何在網上進行搜索，這很好，並且正處於最后的障礙中，如果可能的話，我需要你的幫助。

我有以下內容：

        geocoder = new google.maps.Geocoder(); // creating a new geocode object

    // getting the two address values
    address1 = document.getElementById("addresses1").value;
    distance1 = document.getElementById("distance").value;

    // finding out the coordinates
    if (geocoder) 
    {
        geocoder.geocode( { 'address': address1}, function(results, status) 
        {
            if (status == google.maps.GeocoderStatus.OK) 
            {
                //location of first address (latitude + longitude)
                location1 = results[0].geometry.location;

                // Location Marker
                var marker = new google.maps.Marker({
                  map: map,
                  position: location1,
                  title: 'Random text'
                });
                // Add circle overlay and bind to marker
                var circle = new google.maps.Circle({
                  map: map,
                  radius: distance1,
                  strokeWeight: 0,
                  fillColor: '#AA0000'
                });
                circle.bindTo('center', marker, 'position');


            } else 
            {
                alert("Geocode was not successful for the following reason: " + status);
            }
        });
    }

除了$distance1之外，我已經設法讓一切正常。 應該發生的是，用戶從表單中選擇距離：比如說 10 英里（谷歌地圖以米為單位），當他們點擊提交時，會繪制一個半徑為 10 英里的圓圈。

正如代碼所示，該點已繪制，但未出現圓。

如果我替換distance1 = document.getElementById("distance").value; distance1 = 16999; 例如，然后出現一個圓圈並且它完美地工作。

對我來說，這一定意味着從表單中拉出distance1的內容有問題。 為了確定，我做了一個 NaN 測試，它報告內容是一個數字。

我的問題是（以一種非常冗長的方式 - 對此感到抱歉）你知道如何讓distance1從表格中獲得價值。

// Add circle overlay and bind to marker var circle = new google.maps.Circle({ map: map, radius: distance1, strokeWeight: 0, fillColor: '#AA0000' });

有問題的部分是radius: distance1 1

Answer 1

可能有助於確保它是一個數字，而不是一個字符串。

distance1 = parseFloat(document.getElementById("distance").value);

（parseInt 可能也可以正常工作，因為它以米為單位，而分數米不會有太大區別）