Q:

adding custom marker to Google Maps

I have been trying for some time now to get a custom marker to a google maps frame.  Both custom and standard markers won't show. 
I am using the following code:

google.maps.event.addDomListener(window, 'load', init);

var map;


function init() {
    var mapOptions = {
        center: new google.maps. LatLng(51.231245, 6.078348),
        zoom: 10,
        zoomControl: true,
        zoomControlOptions: {
            style: google.maps. ZoomControlStyle. DEFAULT,
        },
        disableDoubleClickZoom: true,
        mapTypeControl: true,
        mapTypeControlOptions: {
            style: google.maps. MapTypeControlStyle. DROPDOWN_MENU,
        },
        scaleControl: true,
        scrollwheel: false,
        streetViewControl: true,
        draggable : true,
        overviewMapControl: true,
        overviewMapControlOptions: {
            opened: true,
        },

}    

 var image = 'http://aandegrens.appartdev.nl/wp-content/uploads/2016/03/Google_Maps.png';
 var myLatLng = {lat: 51.231245, lng: 6.078348};
  var marker = new google.maps. Marker({
    position: myLatLng,
    map: map,
 title: 'Hello World',
    icon: image
  });
  

  var map = new google.maps. Map(document.getElementById('map'), mapOptions)};

The map itself shows up fine and works all good, only the marker doesn't show. 

A:

You are setting the map: map on the marker before the map has been created.  Just move var map = new google.maps. Map(document.getElementById('map'), mapOptions); before var image = ... and it should work. 
fiddle: https://jsfiddle.net/uj13t71y/

