title: Google Places API, additional marker (manually added) to results
body: <p>My javascript isn't too hot, I'm trying to add a manual marker onto a number of locations gathered from the Google Places API.</p>
  
  <p>I followed <strong><a href="https://stackoverflow.com/questions/11775774/seperate-marker-for-each-location-type-in-google-places-api">this post</a></strong> to get to my following code (with a few amendments):</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
        var map;
        var infowindow;
        var service ;
      base_Icon_festival = "https://maps.gstatic.com/mapfiles/ms2/micons/volcano.png";
      shadow_festival = "https://maps.gstatic.com/mapfiles/ms2/micons/volcano.shadow.png";
  
        function initialize(lat,lng) 
        {
          var origin = new google.maps.LatLng(lat,lng);
  
          map = new google.maps.Map(document.getElementById('map'), {
            mapTypeId: google.maps.MapTypeId.HYBRID,
            center: origin,
            zoom: 14,
        scrollwheel: false,
  
          });
  
          var request = {
            location: origin,
            radius: 2500,
            types: ['train_station','bus_station','subway_station','airport']
          };
          infowindow = new google.maps.InfoWindow();
          service = new google.maps.places.PlacesService(map);
          service.search(request, callback);
        }
  
        function callback(results, status) {
          if (status == google.maps.places.PlacesServiceStatus.OK) {
            for (var i = 0; i &lt; results.length; i++) {
              createMarker(results[i]);
            }
          }
        }
  
      base_Icon_train = "http://maps.google.com/mapfiles/ms/icons/red-dot.png";               
          base_Icon_bus = "http://maps.google.com/mapfiles/ms/icons/green-dot.png";  
          base_Icon_subway = "http://maps.google.com/mapfiles/ms/icons/blue-dot.png";   
          base_Icon_airport = "http://maps.google.com/mapfiles/ms/icons/yellow.png";  
  
        function createMarker(place) {
  
      var placeLoc = place.geometry.location;
          var marker;
          var icon_to_use;
  
      if (place.types.indexOf('train_station') != -1) {
             icon_to_use = base_Icon_train;
      } else if (place.types.indexOf('bus_station') != -1) {
             icon_to_use = base_Icon_bus;
      } else if (place.types.indexOf('subway_station') != -1) {
             icon_to_use = base_Icon_subway;
      } else if (place.types.indexOf('airport') != -1) {
             icon_to_use = base_Icon_airport;
      } 
  
  marker = new google.maps.Marker({
        map: map,
        position: place.geometry.location,
      icon: icon_to_use  
      });
  
          var content='&lt;strong style="font-size:1.2em"&gt;'+place.name+'&lt;/strong&gt;'+
                      '&lt;br/&gt;&lt;strong&gt;Latitude: &lt;/strong&gt;'+placeLoc.lat()+
                      '&lt;br/&gt;&lt;strong&gt;Longitude: &lt;/strong&gt;'+placeLoc.lng()+
                      '&lt;br/&gt;&lt;strong&gt;Type: &lt;/strong&gt;'+place.types[0];
  
          //make a request for further details
          service.getDetails({reference:place.reference}, function (place, status) 
                                      {
                                        if (status == google.maps.places.PlacesServiceStatus.OK) 
                                        {
                                          more_content='&lt;hr/&gt;&lt;strong&gt;&lt;a href="'+place.url+'" target="details"&gt;Details&lt;/a&gt;';
  
                                          if(place.website)
                                          {
                                            more_content+='&lt;br/&gt;&lt;br/&gt;&lt;strong&gt;&lt;a href="'+place.website+'" target="details"&gt;'+place.website+'&lt;/a&gt;';
                                          }
                                        }
                                      });
  
  
          google.maps.event.addListener(marker, 'click', function() {
  
            infowindow.setContent(content+more_content);
            infowindow.open(map, this);
          });
  
        }
  
        google.maps.event.addDomListener(window, 'load', function(){initialize(&lt;?php echo $coordinated; ?&gt;);});
      &lt;/script&gt;
      &lt;div id="map" style="height:400px;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Now I would like to manually add another marker which is located at the center of the map (ie, the variable origin which is currently being pulled from a PHP variable - <code>var origin = new google.maps.LatLng(lat,lng);</code>). I also need this marker to have a different icon associated with it (<code>base_Icon_festival</code> and <code>shadow_festival</code> respectively).</p>
  
  <p>I'm not sure how to manually add another marker to the ones already gathered by the places API?</p>
  
  <p>End goal: have a festival icon marker at the center of the map and a number of public transport markers surrounding it, resulting code to go on individual festival pages of a website.</p>
  
  <p>Thanks in advance to anyone who can help.</p>