javascript - null（googlemaps）のプロパティを読み取れません-ページが読み込まれていることを確認しても

Question

事前に定義された座標でマップをレンダリングし、検索からのマーカー配列の情報を使用して、現在のユーザー情報などを含むインフォボックスをレンダリングする Google マップ用のスクリプトがありますが、奇妙な問題があります。ほとんどの場合、マップは正常に機能しますが、あまりにも頻繁に (特に最後の 2 日間)、「null のプロパティを読み取れません」というエラーが発生しました。他のスレッドを読んで理解した限りでは、問題は、マップを追加しようとする (または getelementbyId) 前に、マップを含む div が作成されていない可能性があります。そのため、ページがロードされていることを確認するために domlistener を追加しました。どこに問題があるのでしょうか？私は今途方に暮れているので:(

<script type="text/javascript">
function initialize() {
    var markers = <?php echo json_encode($markers); ?>;

    var myLatLng = new google.maps.LatLng( <?= $search->area_coords; ?> );

    var mapOptions = {
        center:myLatLng,
        zoom:12,
        maxZoom:14,
        mapTypeId:google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"),
            mapOptions);

    // Custom MarkerImage - To be designed
    // var markerImage = 'images/markerImage.png';

    var iconBase = 'http://www.googlemapsmarkers.com/v1/H/0099FF/';

    var infowindow = new google.maps.InfoWindow({
        maxWidth:150
    });

    for (i = 0; i < markers.length; i++) {

        // Array to contain all the markers for clickevents etc.
        var markersArray = [];
        var position = new google.maps.LatLng(markers[i]['lat'], markers[i]['long']);
        var contentString = '<div class="marker_info"><div class="float_left"><img height="40" width="40" src="' + markers[i]['picture'] + '"></div>' +
                '<div><a href="profile.php?userid=' + markers[i]['id'] + '">' + markers[i]['title'] +
                '</a></div><br><em>' + markers[i]['price'] + ' pounds</em></div>';

        var marker = new google.maps.Marker({
            position:position,
            map:map,
            icon:iconBase,
            htmlCode:contentString
        });

        google.maps.event.addListener(marker, 'click', function () {
            infowindow.setContent(this.htmlCode);
            infowindow.open(map, this);
        });
        markersArray.push(marker);
    }
}

google.maps.event.addDomListener(window, "load", initialize);

エラー メッセージには行番号 246 が表示されます。正しくチェックされていれば、次の行を参照する必要があります。

 var myLatLng = new google.maps.LatLng( <?= $search->area_coords; ?> ); 

• しかし、ブラウザがドキュメントを別の方法で読み取る可能性があるため、これについて 100% ではありません。それとも、ここで間違っていますか?

map_canvas の div は、100 行目あたりにできる限り標準で作成されます (ここに HTML を表示することはできませんが、通常の div にすぎません)。

 <div class="map" id="map_canvas">
    <!-- DIV that contains the Map of users -->
 </div>