javascript - GoogleMapsAPI-ルートルートサービスへのマーカー

Question

指向性Googleマップにマーカー（カスタムアイコン）を追加しようとしていますが、initialize（）関数の外にこれらを追加できないようです。

ルートに基づいてアイコンを変更したいので、initialize（）関数の外にそれらを追加する必要があります。私が問題を抱えているのは、ADD EXTRAMARKERSTESTです。スクリプトの残りの部分はすべて完全に機能します。

助けてくれてありがとう。

これまでのコード：

       var directionDisplay;
       var directionsService = new google.maps.DirectionsService();
       var stepDisplay;



        function initialize() {
            var latlng = new google.maps.LatLng( <? echo $lat; ?> , <? echo $lon; ?> );
            var rendererOptions = {draggable: true};
            directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions);
            var myOptions = {zoom: 14,center: latlng,mapTypeId: google.maps.MapTypeId.ROADMAP,mapTypeControl: false};
            var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
            directionsDisplay.setMap(map);  
        directionsDisplay.setPanel(document.getElementById("directionsPanel"));
                 }

// calcRoute

        function calcRoute() {
            var travelMode = 'DRIVING';
            var start = $("#routeStart").val();
            var via = $("#routeVia2").val();
            var end = $("#routeVia").val();
            var waypoints = [];
            if (via != '') {waypoints.push({location: via,stopover: true});
            }
            var request = {
                origin: start,
                destination: end,
                waypoints: waypoints,
                unitSystem: google.maps.UnitSystem.IMPERIAL,
                travelMode: google.maps.DirectionsTravelMode[travelMode]
            };

//ルートを表示し、LATLNGをPHPファイルに渡してさらに処理します

    directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {            
    directionsDisplay.setDirections(response);
    var myRoute = response.routes[0];
    var txtDir = '';
    for (var i=0; i<myRoute.legs[0].steps.length; i++) {
    txtDir += myRoute.legs[0].steps[i].path+"";                             
    }
var strLAT = "" + txtDir;

//データをURLPHPファイルに送信

     var xmlHttp = getXMLHttp();
     xmlHttp.onreadystatechange = function() {
     if (xmlHttp.readyState == 4) {
     HandleResponse(xmlHttp.responseText);
     }}                     
     xmlHttp.open("POST",'MYPHPFILE',true);
     xmlHttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
     xmlHttp.send("LATLON="+strLAT);

//PHPで処理されたデータが正しく処理されていることを確認するためのアラートテスト

    function HandleResponse(response) {
            document.getElementById('ResponseDiv').innerHTML = response;
            alert($('#ResponseDiv').text());
        }

追加のマーカーテストを追加

      var wxlatlng = new google.maps.LatLng( 52 , -1 );
            var marker = new google.maps.Marker({ 
            position: wxlatlng, 
            map: map, 
            icon: "http://nwsgeo.com/demo/images/pins/road-closed.jpg", 
            title: "test icon", 

     });

//エラーメッセージ

     }else{
     if (status == 'ZERO_RESULTS') {
     alert('No route could be found between the origin and destination.');
     }else if(status == 'INVALID_REQUEST') {
     alert('The DirectionsRequest provided was invalid.');
     }else{
     alert("There was an unknown error in your request. Requeststatus: nn" + status);
     }}});}