This is my first attempt at object oriented javascript code. I have been writing JavaScript code for few years now but this is first time I am trying to write OO javascript code. I have read about OO javascript, but I am not still very confident about it.
Could you please review it and provide your comments about this implementation of OO javascript?
"use strict";
var maps_1, maps_2, maps_3, maps_4;
var markers_array1 = [], markers_array2 = [], markers_array3 = [], markers_array4 = [];
var google_map = function (x,y,z) {
this.map = new google.maps.Map(document.getElementById(x), {
zoom : parseInt(z),
center : y,
mapnameId : google.maps.MapnameId.ROADMAP,
disableDefaultUI : true,
styles : {
featurename : "poi",
elementname : "labels",
stylers : [{
visibility : "off"
}
]
}
});
};
var google_marker = function(x,map) {
var icon_url = 'icons/' + x.dname + '_' + ((x.dname2 === 0) ? '0.png' : '1.png');
var lat = parseFloat(x.lat), lng = parseFloat(x.lng);
if(lat*lng > 0) {
this.marker = new google.maps.Marker({
icon : icon_url,
position: {"lat":lat,"lng":lng},
description : '<b>'+x.name+'</b><br>'+x.desc,
title: x.dname,
start: x.start,
map: map
});
this.marker.addListener('click', infoWindow);
}
}
function loadJson() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST", "ajax.php", true);
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlhttp.send(data);
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
loadMarkers(JSON.parse(xmlhttp.response));
}
}
}
function init() {
maps_1 = new google_map('maps_1',{"lat" : 32.93,"lng" : 85.06},12);
maps_2 = new google_map('maps_2',{"lat" : 70.88,"lng" : 45.97},12);
maps_3 = new google_map('maps_3',{"lat" : 60.49,"lng" : 38.00},12);
maps_4 = new google_map('maps_4',{"lat" : 85.85,"lng" : 89.63},12);
loadJson();
}
function loadMarkers(Markers) {
for(var y in Markers) {
var x = Markers[y];
markers_array1.push(new google_marker (x,maps_1.map));
markers_array2.push(new google_marker (x,maps_2.map));
markers_array3.push(new google_marker (x,maps_3.map));
markers_array4.push(new google_marker (x,maps_4.map));
}
}
init();