예제 #1
0
 /**
  * print a child ascendancy
  *
  * @param Individual $individual
  * @param int        $sosa  child sosa number
  * @param int        $depth the ascendancy depth to show
  */
 public function printChildAscendancy(Individual $individual, $sosa, $depth)
 {
     echo '<li>';
     echo '<table><tbody><tr><td>';
     if ($sosa === 1) {
         echo '<img src="', Theme::theme()->parameter('image-spacer'), '" height="3" width="', Theme::theme()->parameter('chart-descendancy-indent'), '"></td><td>';
     } else {
         echo '<img src="', Theme::theme()->parameter('image-spacer'), '" height="3" width="2" alt="">';
         echo '<img src="', Theme::theme()->parameter('image-hline'), '" height="3" width="', Theme::theme()->parameter('chart-descendancy-indent') - 2, '"></td><td>';
     }
     FunctionsPrint::printPedigreePerson($individual, $this->showFull());
     echo '</td><td>';
     if ($sosa > 1) {
         FunctionsCharts::printUrlArrow('?rootid=' . $individual->getXref() . '&amp;PEDIGREE_GENERATIONS=' . $this->generations . '&amp;show_full=' . $this->showFull() . '&amp;chart_style=' . $this->chart_style . '&amp;ged=' . $individual->getTree()->getNameUrl(), I18N::translate('Ancestors of %s', $individual->getFullName()), 3);
     }
     echo '</td><td class="details1">&nbsp;<span class="person_box' . ($sosa === 1 ? 'NN' : ($sosa % 2 ? 'F' : '')) . '">', I18N::number($sosa), '</span> ';
     echo '</td><td class="details1">&nbsp;', FunctionsCharts::getSosaName($sosa), '</td>';
     echo '</tr></tbody></table>';
     // Parents
     $family = $individual->getPrimaryChildFamily();
     if ($family && $depth > 0) {
         // Marriage details
         echo '<span class="details1">';
         echo '<img src="', Theme::theme()->parameter('image-spacer'), '" height="2" width="', Theme::theme()->parameter('chart-descendancy-indent'), '" alt=""><a href="#" onclick="return expand_layer(\'sosa_', $sosa, '\');" class="top"><i id="sosa_', $sosa, '_img" class="icon-minus" title="', I18N::translate('View family'), '"></i></a>';
         echo ' <span class="person_box">', I18N::number($sosa * 2), '</span> ', I18N::translate('and');
         echo ' <span class="person_boxF">', I18N::number($sosa * 2 + 1), '</span>';
         if ($family->canShow()) {
             foreach ($family->getFacts(WT_EVENTS_MARR) as $fact) {
                 echo ' <a href="', $family->getHtmlUrl(), '" class="details1">', $fact->summary(), '</a>';
             }
         }
         echo '</span>';
         // display parents recursively - or show empty boxes
         echo '<ul id="sosa_', $sosa, '" class="generation">';
         if ($family->getHusband()) {
             $this->printChildAscendancy($family->getHusband(), $sosa * 2, $depth - 1);
         }
         if ($family->getWife()) {
             $this->printChildAscendancy($family->getWife(), $sosa * 2 + 1, $depth - 1);
         }
         echo '</ul>';
     }
     echo '</li>';
 }
예제 #2
0
    /**
     * Create the Javascript to activate the map.
     *
     * @return string
     */
    private function pedigreeMapJavascript()
    {
        global $PEDIGREE_GENERATIONS;
        // The HomeControl returns the map to the original position and style
        $js = 'function HomeControl(controlDiv, pm_map) {' . 'controlDiv.style.paddingTop = "5px";
			controlDiv.style.paddingRight = "0px";' . 'var controlUI = document.createElement("DIV");
			controlUI.style.backgroundColor = "white";
			controlUI.style.color = "black";
			controlUI.style.borderColor = "black";
			controlUI.style.borderColor = "black";
			controlUI.style.borderStyle = "solid";
			controlUI.style.borderWidth = "2px";
			controlUI.style.cursor = "pointer";
			controlUI.style.textAlign = "center";
			controlUI.title = "";
			controlDiv.appendChild(controlUI);' . 'var controlText = document.createElement("DIV");
			controlText.style.fontFamily = "Arial,sans-serif";
			controlText.style.fontSize = "12px";
			controlText.style.paddingLeft = "15px";
			controlText.style.paddingRight = "15px";
			controlText.innerHTML = "<b>' . I18N::translate('Redraw map') . '<\\/b>";
			controlUI.appendChild(controlText);' . 'google.maps.event.addDomListener(controlUI, "click", function() {
				pm_map.setMapTypeId(google.maps.MapTypeId.TERRAIN),
				pm_map.fitBounds(bounds),
				pm_map.setCenter(bounds.getCenter()),
				infowindow.close()
				if (document.getElementById(lastlinkid) != null) {
					document.getElementById(lastlinkid).className = "person_box:target";
				}
			});
		}' . 'function myclick(i) {
			if (document.getElementById(lastlinkid) != null) {
				document.getElementById(lastlinkid).className = "person_box:target";
			}
			google.maps.event.trigger(gmarkers[i], "click");
			return false;
		}' . 'var side_bar_html = "";' . 'var gmarkers = [];
		var i = 0;
		var lastlinkid;
		var infowindow = new google.maps.InfoWindow({});' . 'var gicons = [];
		gicons["1"]        = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon1.png")
		gicons["1"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow50.png",
									new google.maps.Size(37, 34), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(10, 34) // Shadow anchor is base of image
								);
		gicons["2"]         = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon2.png")
		gicons["2"].shadow  = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow50.png",
									new google.maps.Size(37, 34), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(10, 34) // Shadow anchor is base of image
								);
		gicons["2L"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon2L.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(28, 28) // Image anchor
								);
		gicons["2L"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-left-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(32, 27) // Shadow anchor is base of image
								);
		gicons["2R"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon2R.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(4, 28)  // Image anchor
								);
		gicons["2R"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-right-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(15, 27) // Shadow anchor is base of image
								);
		gicons["2Ls"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon2Ls.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(22, 22) // Image anchor
								);
		gicons["2Rs"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon2Rs.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(2, 22)  // Image anchor
								);
		gicons["3"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon3.png")
		gicons["3"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow50.png",
									new google.maps.Size(37, 34), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(10, 34) // Shadow anchor is base of image
								);
		gicons["3L"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon3L.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(28, 28) // Image anchor
								);
		gicons["3L"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-left-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(32, 27) // Shadow anchor is base of image
								);
		gicons["3R"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon3R.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(4, 28)  // Image anchor
								);
		gicons["3R"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-right-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(15, 27) // Shadow anchor is base of image
								);
		gicons["3Ls"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon3Ls.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(22, 22) // Image anchor
								);
		gicons["3Rs"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon3Rs.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(2, 22)  // Image anchor
								);
		gicons["4"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon4.png")
		gicons["4"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow50.png",
									new google.maps.Size(37, 34), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(10, 34) // Shadow anchor is base of image
								);
		gicons["4L"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon4L.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(28, 28) // Image anchor
								);
		gicons["4L"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-left-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(32, 27) // Shadow anchor is base of image
								);
		gicons["4R"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon4R.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(4, 28)  // Image anchor
								);
		gicons["4R"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-right-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(15, 27) // Shadow anchor is base of image
								);
		gicons["4Ls"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon4Ls.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(22, 22) // Image anchor
								);
		gicons["4Rs"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon4Rs.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(2, 22)  // Image anchor
								);
		gicons["5"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon5.png")
		gicons["5"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow50.png",
									new google.maps.Size(37, 34), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(10, 34) // Shadow anchor is base of image
								);
		gicons["5L"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon5L.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(28, 28) // Image anchor
								);
		gicons["5L"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-left-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(32, 27) // Shadow anchor is base of image
								);
		gicons["5R"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon5R.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(4, 28)  // Image anchor
								);
		gicons["5R"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-right-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(15, 27) // Shadow anchor is base of image
								);
		gicons["5Ls"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon5Ls.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(22, 22) // Image anchor
								);
		gicons["5Rs"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon5Rs.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(2, 22)  // Image anchor
								);
		gicons["6"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon6.png")
		gicons["6"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow50.png",
									new google.maps.Size(37, 34), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(10, 34) // Shadow anchor is base of image
								);
		gicons["6L"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon6L.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(28, 28) // Image anchor
								);
		gicons["6L"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-left-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(32, 27) // Shadow anchor is base of image
								);
		gicons["6R"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon6R.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(4, 28)  // Image anchor
								);
		gicons["6R"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-right-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(15, 27) // Shadow anchor is base of image
								);
		gicons["6Ls"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon6Ls.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(22, 22) // Image anchor
								);
		gicons["6Rs"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon6Rs.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(2, 22)  // Image anchor
								);
		gicons["7"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon7.png")
		gicons["7"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow50.png",
									new google.maps.Size(37, 34), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(10, 34) // Shadow anchor is base of image
								);
		gicons["7L"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon7L.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(28, 28) // Image anchor
								);
		gicons["7L"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-left-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(32, 27) // Shadow anchor is base of image
								);
		gicons["7R"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon7R.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(4, 28)  // Image anchor
								);
		gicons["7R"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-right-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(15, 27) // Shadow anchor is base of image
								);
		gicons["7Ls"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon7Ls.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(22, 22) // Image anchor
								);
		gicons["7Rs"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon7Rs.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(2, 22)  // Image anchor
								);
		gicons["8"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon8.png")
		gicons["8"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow50.png",
									new google.maps.Size(37, 34), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(10, 34) // Shadow anchor is base of image
								);
		gicons["8L"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon8L.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(28, 28) // Image anchor
								);
		gicons["8L"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-left-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(32, 27) // Shadow anchor is base of image
								);
		gicons["8R"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon8R.png",
									new google.maps.Size(32, 32), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(4, 28)  // Image anchor
								);
		gicons["8R"].shadow = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/shadow-right-large.png",
									new google.maps.Size(49, 32), // Shadow size
									new google.maps.Point(0, 0),  // Shadow origin
									new google.maps.Point(15, 27) // Shadow anchor is base of image
								);
		gicons["8Ls"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon8Ls.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(22, 22) // Image anchor
								);
		gicons["8Rs"] = new google.maps.MarkerImage(WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon8Rs.png",
									new google.maps.Size(24, 24), // Image size
									new google.maps.Point(0, 0),  // Image origin
									new google.maps.Point(2, 22)  // Image anchor
								);' . 'function createMarker(point, name, html, mhtml, icontype) {
			var contentString = "<div id=\'iwcontent_edit\'>"+mhtml+"<\\/div>";' . 'var marker = new google.maps.Marker({
				icon:     gicons[icontype],
				shadow:   gicons[icontype].shadow,
				map:      pm_map,
				position: point,
				zIndex:   0
			});
			var linkid = "link"+i;
			google.maps.event.addListener(marker, "click", function() {
				infowindow.close();
				infowindow.setContent(contentString);
				infowindow.open(pm_map, marker);
				document.getElementById(linkid).className = "person_box";
				if (document.getElementById(lastlinkid) != null) {
					document.getElementById(lastlinkid).className = "person_box:target";
				}
				lastlinkid=linkid;
			});' . 'gmarkers[i] = marker;' . 'side_bar_html += "<br><div id=\'"+linkid+"\' onclick=\'return myclick(" + i + ")\'>" + html +"<br></div>";
			i++;
			return marker;
		};' . 'var myOptions = {
			zoom: 6,
			center: new google.maps.LatLng(0, 0),
			mapTypeId: google.maps.MapTypeId.TERRAIN,  // ROADMAP, SATELLITE, HYBRID, TERRAIN
			mapTypeControlOptions: {
				style: google.maps.MapTypeControlStyle.DROPDOWN_MENU  // DEFAULT, DROPDOWN_MENU, HORIZONTAL_BAR
			},
			navigationControlOptions: {
				position: google.maps.ControlPosition.TOP_RIGHT,  // BOTTOM, BOTTOM_LEFT, LEFT, TOP, etc
				style: google.maps.NavigationControlStyle.SMALL   // ANDROID, DEFAULT, SMALL, ZOOM_PAN
			},
			streetViewControl: false,  // Show Pegman or not
			scrollwheel: true
		};
		var pm_map = new google.maps.Map(document.getElementById("pm_map"), myOptions);
		google.maps.event.addListener(pm_map, "click", function() {
			if (document.getElementById(lastlinkid) != null) {
				document.getElementById(lastlinkid).className = "person_box:target";
			}
		infowindow.close();
		});' . 'var homeControlDiv = document.createElement("DIV");
		var homeControl = new HomeControl(homeControlDiv, pm_map);
		homeControlDiv.index = 1;
		pm_map.controls[google.maps.ControlPosition.TOP_RIGHT].push(homeControlDiv);' . 'var bounds = new google.maps.LatLngBounds();';
        // add the points
        $curgen = 1;
        $count = 0;
        $colored_line = array('1' => '#FF0000', '2' => '#0000FF', '3' => '#00FF00', '4' => '#FFFF00', '5' => '#00FFFF', '6' => '#FF00FF', '7' => '#C0C0FF', '8' => '#808000');
        $lat = array();
        $lon = array();
        $latlongval = array();
        for ($i = 0; $i < $this->treesize; $i++) {
            // moved up to grab the sex of the individuals
            $person = $this->ancestors[$i];
            if ($person) {
                $name = $person->getFullName();
                // -- check to see if we have moved to the next generation
                if ($i + 1 >= pow(2, $curgen)) {
                    $curgen++;
                }
                $relationship = FunctionsCharts::getSosaName($i + 1);
                $event = '<img src="' . WT_STATIC_URL . WT_MODULES_DIR . 'googlemap/images/sq' . $curgen . '.png" width="10" height="10"> ' . '<strong>' . $relationship . '</strong>';
                // add thumbnail image
                if ($person->getTree()->getPreference('SHOW_HIGHLIGHT_IMAGES')) {
                    $image = $person->displayImage();
                } else {
                    $image = '';
                }
                // end of add image
                $birth = $person->getFirstFact('BIRT');
                $dataleft = Filter::escapeJs($image . $event . ' — ' . $name);
                $datamid = Filter::escapeJs(' <span><a href="' . $person->getHtmlUrl() . '">(' . I18N::translate('View individual') . ')</a></span>');
                $dataright = $birth ? Filter::escapeJs($birth->summary()) : '';
                $latlongval[$i] = $this->getLatitudeAndLongitudeFromPlaceLocation($person->getBirthPlace());
                if ($latlongval[$i]) {
                    $lat[$i] = (double) str_replace(array('N', 'S', ','), array('', '-', '.'), $latlongval[$i]->pl_lati);
                    $lon[$i] = (double) str_replace(array('E', 'W', ','), array('', '-', '.'), $latlongval[$i]->pl_long);
                    if ($lat[$i] || $lon[$i]) {
                        $marker_number = $curgen;
                        $dups = 0;
                        for ($k = 0; $k < $i; $k++) {
                            if ($latlongval[$i] == $latlongval[$k]) {
                                $dups++;
                                switch ($dups) {
                                    case 1:
                                        $marker_number = $curgen . 'L';
                                        break;
                                    case 2:
                                        $marker_number = $curgen . 'R';
                                        break;
                                    case 3:
                                        $marker_number = $curgen . 'Ls';
                                        break;
                                    case 4:
                                        $marker_number = $curgen . 'Rs';
                                        break;
                                    case 5:
                                        //adjust position where markers have same coodinates
                                    //adjust position where markers have same coodinates
                                    default:
                                        $marker_number = $curgen;
                                        $lon[$i] = $lon[$i] + 0.0025;
                                        $lat[$i] = $lat[$i] + 0.0025;
                                        break;
                                }
                            }
                        }
                        $js .= 'var point = new google.maps.LatLng(' . $lat[$i] . ',' . $lon[$i] . ');';
                        $js .= "var marker = createMarker(point, \"" . Filter::escapeJs($name) . "\",\"<div>" . $dataleft . $datamid . $dataright . "</div>\", \"";
                        $js .= "<div class='iwstyle'>";
                        $js .= "<a href='module.php?ged=" . $person->getTree()->getNameUrl() . "&amp;mod=googlemap&amp;mod_action=pedigree_map&amp;rootid=" . $person->getXref() . "&amp;PEDIGREE_GENERATIONS={$PEDIGREE_GENERATIONS}";
                        $js .= "' title='" . I18N::translate('Pedigree map') . "'>" . $dataleft . "</a>" . $datamid . $dataright . "</div>\", \"" . $marker_number . "\");";
                        // Construct the polygon lines
                        $to_child = intval(($i - 1) / 2);
                        // Draw a line from parent to child
                        if (array_key_exists($to_child, $lat) && $lat[$to_child] != 0 && $lon[$to_child] != 0) {
                            $js .= '
								var linecolor;
								var plines;
								var lines = [new google.maps.LatLng(' . $lat[$i] . ',' . $lon[$i] . '),
									new google.maps.LatLng(' . $lat[$to_child] . ',' . $lon[$to_child] . ')];
								linecolor = "' . $colored_line[$curgen] . '";
								plines = new google.maps.Polygon({
									paths: lines,
									strokeColor: linecolor,
									strokeOpacity: 0.8,
									strokeWeight: 3,
									fillColor: "#FF0000",
									fillOpacity: 0.1
								});
								plines.setMap(pm_map);';
                        }
                        // Extend and fit marker bounds
                        $js .= 'bounds.extend(point);';
                        $js .= 'pm_map.fitBounds(bounds);';
                        $count++;
                    }
                }
            } else {
                $latlongval[$i] = null;
            }
        }
        $js .= 'pm_map.setCenter(bounds.getCenter());' . 'google.maps.event.addListener(infowindow, "closeclick", function() {
			document.getElementById(lastlinkid).className = "person_box:target";
		});' . 'document.getElementById("side_bar").innerHTML = side_bar_html;' . 'var contextmenu = document.createElement("div");
			contextmenu.style.visibility="hidden";
			contextmenu.innerHTML = "<a href=\'#\' onclick=\'zoomIn()\'><div class=\'optionbox\'>&nbsp;&nbsp;' . I18N::translate('Zoom in') . '&nbsp;&nbsp;</div></a>"
								+ "<a href=\'#\' onclick=\'zoomOut()\'><div class=\'optionbox\'>&nbsp;&nbsp;' . I18N::translate('Zoom out') . '&nbsp;&nbsp;</div></a>"
								+ "<a href=\'#\' onclick=\'zoomInHere()\'><div class=\'optionbox\'>&nbsp;&nbsp;' . I18N::translate('Zoom in here') . '</div></a>"
								+ "<a href=\'#\' onclick=\'zoomOutHere()\'><div class=\'optionbox\'>&nbsp;&nbsp;' . I18N::translate('Zoom out here') . '&nbsp;&nbsp;</div></a>"
								+ "<a href=\'#\' onclick=\'centreMapHere()\'><div class=\'optionbox\'>&nbsp;&nbsp;' . I18N::translate('Center map here') . '&nbsp;&nbsp;</div></a>";' . 'google.maps.event.addListener(pm_map,"singlerightclick", function(pixel,tile) {' . 'clickedPixel = pixel;
			var x=pixel.x;
			var y=pixel.y;
			if (x > pm_map.getSize().width - 120) { x = pm_map.getSize().width - 120 }
			if (y > pm_map.getSize().height - 100) { y = pm_map.getSize().height - 100 }
			var pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(x,y));
			pos.apply(contextmenu);
			contextmenu.style.visibility = "visible";
		});
		' . 'function zoomIn() {' . 'pm_map.zoomIn();' . 'contextmenu.style.visibility="hidden";
		}
		function zoomOut() {' . 'pm_map.zoomOut();' . 'contextmenu.style.visibility="hidden";
		}
		function zoomInHere() {' . 'var point = pm_map.fromContainerPixelToLatLng(clickedPixel)
			pm_map.zoomIn(point,true);' . 'contextmenu.style.visibility="hidden";
		}
		function zoomOutHere() {' . 'var point = pm_map.fromContainerPixelToLatLng(clickedPixel)
			pm_map.setCenter(point,pm_map.getZoom()-1);' . 'contextmenu.style.visibility="hidden";
		}
		function centreMapHere() {' . 'var point = pm_map.fromContainerPixelToLatLng(clickedPixel)
			pm_map.setCenter(point);' . 'contextmenu.style.visibility="hidden";
		}' . 'google.maps.event.addListener(pm_map, "click", function() {
			contextmenu.style.visibility="hidden";
		});';
        return $js;
    }
예제 #3
0
    /**
     * Create the Javascript to activate the map.
     *
     * @return string
     */
    private function pedigreeMapJavascript()
    {
        $js = '
		// this variable will collect the html which will eventually be placed in the side bar
		var gm_ancestors_html = "";
		// arrays to hold copies of the markers and html used by the side bar
		// because the function closure trick doesnt work there
		var gmarkers = [];
		var index = 0;
		var lastlinkid;
		var infowindow = new google.maps.InfoWindow({});
		// === Create an associative array of GIcons()
		var gicons = [];
		gicons["1"]  = 	{
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon1.png"
						}
		gicons["2"]  = 	{
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon2.png"
						}
		gicons["2L"] = 	{
							url: 	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon2L.png",
							size:  	new google.maps.Size(32, 32), // Image size
							origin: new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(28, 28) // Image anchor
						};
		gicons["2R"] = 	{
							url: 	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon2R.png",
							size: 	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(4, 28)  // Image anchor
						};
		gicons["2Ls"] = {
							url: 	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon2Ls.png",
							size: 	new google.maps.Size(24, 24), // Image size
							origin: new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(22, 22) // Image anchor
						};
		gicons["2Rs"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon2Rs.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(2, 22)  // Image anchor
						};
		gicons["3"]   = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon3.png"
						}
		gicons["3L"]  = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon3L.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(28, 28) // Image anchor
						};
		gicons["3R"]  = {
							url: 	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon3R.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(4, 28)  // Image anchor
						};
		gicons["3Ls"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon3Ls.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(22, 22) // Image anchor
						};
		gicons["3Rs"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon3Rs.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(2, 22)  // Image anchor
						};
		gicons["4"]   = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon4.png"
						}
		gicons["4L"]  = {
							url: 	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon4L.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(28, 28) // Image anchor
						};
		gicons["4R"] = 	{
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon4R.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(4, 28)  // Image anchor
						};
		gicons["4Ls"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon4Ls.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(22, 22) // Image anchor
						};
		gicons["4Rs"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon4Rs.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(2, 22)  // Image anchor
						};
		gicons["5"] = 	{
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon5.png"
						}
		gicons["5L"] = 	{
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon5L.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(28, 28) // Image anchor
						};
		gicons["5R"] = 	{
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon5R.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(4, 28)  // Image anchor
						};
		gicons["5Ls"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon5Ls.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(22, 22) // Image anchor
						};
		gicons["5Rs"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon5Rs.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(2, 22)  // Image anchor
						};
		gicons["6"] = 	{
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon6.png"
						}
		gicons["6L"] = 	{
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon6L.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(28, 28) // Image anchor
						};
		gicons["6R"] = 	{
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon6R.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(4, 28)  // Image anchor
						};
		gicons["6Ls"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon6Ls.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(22, 22) // Image anchor
						};
		gicons["6Rs"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon6Rs.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(2, 22)  // Image anchor
						};
		gicons["7"]   = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon7.png"
						}
		gicons["7L"]  = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon7L.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(28, 28) // Image anchor
						};
		gicons["7R"]  = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon7R.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(4, 28)  // Image anchor
						};
		gicons["7Ls"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon7Ls.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(22, 22) // Image anchor
						};
		gicons["7Rs"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon7Rs.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(2, 22)  // Image anchor
						};
		gicons["8"]   = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon8.png"
						}
		gicons["8L"]  = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon8L.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(28, 28) // Image anchor
						};
		gicons["8R"]  = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon8R.png",
							size:	new google.maps.Size(32, 32), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(4, 28)  // Image anchor
						};
		gicons["8Ls"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon8Ls.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(22, 22) // Image anchor
						};
		gicons["8Rs"] = {
							url:	WT_STATIC_URL+WT_MODULES_DIR+"googlemap/images/icon8Rs.png",
							size:	new google.maps.Size(24, 24), // Image size
							origin:	new google.maps.Point(0, 0),  // Image origin
							anchor:	new google.maps.Point(2, 22)  // Image anchor
						};
		// / A function to create the marker and set up the event window
		function createMarker(point, name, html, mhtml, icontype) {
			// Create a marker with the requested icon
			var marker = new google.maps.Marker({
				icon:     gicons[icontype],
				map:      pm_map,
				position: point,
				id:       index,
				zIndex:   0
			});
			google.maps.event.addListener(marker, "click", function() {
				infowindow.close();
				infowindow.setContent(mhtml);
				infowindow.open(pm_map, marker);
				var el = jQuery(".gm-ancestor[data-marker=" + marker.id + "]");
				if(el.hasClass("person_box")) {
					el
						.removeClass("person_box")
						.addClass("gm-ancestor-visited");
					infowindow.close();
				} else {
					el
					.addClass("person_box")
					.removeClass("gm-ancestor-visited");
				}
				var anchor = infowindow.getAnchor();
				lastlinkid = anchor ? anchor.id : null;
			});
			// save the info we need to use later for the side bar
			gmarkers[index] = marker;
			gm_ancestors_html += "<div data-marker =" + index++ + " class=\\"gm-ancestor\\">" + html +"</div>";

			return marker;
		};
		// create the map
		var myOptions = {
			zoom:                     6,
			center:                   new google.maps.LatLng(0, 0),
			mapTypeId:                google.maps.MapTypeId.TERRAIN,  // ROADMAP, SATELLITE, HYBRID, TERRAIN
			mapTypeControlOptions:    {
				style: google.maps.MapTypeControlStyle.DROPDOWN_MENU  // DEFAULT, DROPDOWN_MENU, HORIZONTAL_BAR
			},
			navigationControlOptions: {
				position: google.maps.ControlPosition.TOP_RIGHT,  // BOTTOM, BOTTOM_LEFT, LEFT, TOP, etc
				style:    google.maps.NavigationControlStyle.SMALL   // ANDROID, DEFAULT, SMALL, ZOOM_PAN
			},
			streetViewControl:        false,  // Show Pegman or not
			scrollwheel:              true
		};
		var pm_map = new google.maps.Map(document.querySelector(".gm-map"), myOptions);
		google.maps.event.addListener(pm_map, "click", function() {
			jQuery(".gm-ancestor.person_box")
				.removeClass("person_box")
				.addClass("gm-ancestor-visited");
			infowindow.close();
			lastlinkid = null;
		});
		// create the map bounds
		var bounds = new google.maps.LatLngBounds();';
        // add the points
        $curgen = 1;
        $count = 0;
        $colored_line = array('1' => '#FF0000', '2' => '#0000FF', '3' => '#00FF00', '4' => '#FFFF00', '5' => '#00FFFF', '6' => '#FF00FF', '7' => '#C0C0FF', '8' => '#808000');
        $lat = array();
        $lon = array();
        $latlongval = array();
        for ($i = 0; $i < $this->treesize; $i++) {
            // moved up to grab the sex of the individuals
            $person = $this->ancestors[$i];
            if ($person) {
                $name = $person->getFullName();
                // -- check to see if we have moved to the next generation
                if ($i + 1 >= pow(2, $curgen)) {
                    $curgen++;
                }
                $relationship = FunctionsCharts::getSosaName($i + 1);
                // get thumbnail image
                if ($person->getTree()->getPreference('SHOW_HIGHLIGHT_IMAGES')) {
                    $image = $person->displayImage();
                } else {
                    $image = '';
                }
                $event = '<img src="' . WT_STATIC_URL . WT_MODULES_DIR . 'googlemap/images/sq' . $curgen . '.png" width="10" height="10"> ';
                $event .= '<strong>' . $relationship . '</strong>';
                $birth = $person->getFirstFact('BIRT');
                $data = Filter::escapeJs($image . '<div class="gm-ancestor-link">' . $event . ' <span><a href="' . $person->getHtmlUrl() . '">' . $name . '</a></span>');
                $data .= $birth ? Filter::escapeJs($birth->summary()) : '';
                $data .= '</div>';
                $latlongval[$i] = $this->getLatitudeAndLongitudeFromPlaceLocation($person->getBirthPlace());
                if ($latlongval[$i]) {
                    $lat[$i] = (double) strtr($latlongval[$i]->pl_lati, array('N' => '', 'S' => '-', ',' => '.'));
                    $lon[$i] = (double) strtr($latlongval[$i]->pl_long, array('E' => '', 'W' => '-', ',' => '.'));
                    if ($lat[$i] || $lon[$i]) {
                        $marker_number = $curgen;
                        $dups = 0;
                        for ($k = 0; $k < $i; $k++) {
                            if ($latlongval[$i] == $latlongval[$k]) {
                                $dups++;
                                switch ($dups) {
                                    case 1:
                                        $marker_number = $curgen . 'L';
                                        break;
                                    case 2:
                                        $marker_number = $curgen . 'R';
                                        break;
                                    case 3:
                                        $marker_number = $curgen . 'Ls';
                                        break;
                                    case 4:
                                        $marker_number = $curgen . 'Rs';
                                        break;
                                    case 5:
                                        //adjust position where markers have same coodinates
                                    //adjust position where markers have same coodinates
                                    default:
                                        $marker_number = $curgen;
                                        $lon[$i] += 0.0025;
                                        $lat[$i] += 0.0025;
                                        break;
                                }
                            }
                        }
                        $js .= 'var point = new google.maps.LatLng(' . $lat[$i] . ',' . $lon[$i] . ');';
                        $js .= 'var marker = createMarker(point, "' . Filter::escapeJs($name) . '","' . $data . '", "';
                        $js .= '<div class=\\"gm-info-window\\">' . $data . '</div>", "' . $marker_number . '");';
                        // Construct the polygon lines
                        $to_child = intval(($i - 1) / 2);
                        // Draw a line from parent to child
                        if (array_key_exists($to_child, $lat) && $lat[$to_child] != 0 && $lon[$to_child] != 0) {
                            $js .= '
								var linecolor;
								var plines;
								var lines = [new google.maps.LatLng(' . $lat[$i] . ',' . $lon[$i] . '),
									new google.maps.LatLng(' . $lat[$to_child] . ',' . $lon[$to_child] . ')];
								linecolor = "' . $colored_line[$curgen] . '";
								plines = new google.maps.Polygon({
									paths: lines,
									strokeColor: linecolor,
									strokeOpacity: 0.8,
									strokeWeight: 3,
									fillColor: "#FF0000",
									fillOpacity: 0.1
								});
								plines.setMap(pm_map);';
                        }
                        // Extend and fit marker bounds
                        $js .= 'bounds.extend(point);';
                        $count++;
                    }
                }
            } else {
                $latlongval[$i] = null;
            }
        }
        $js .= '
		pm_map.setCenter(bounds.getCenter());
		pm_map.fitBounds(bounds);
		google.maps.event.addListenerOnce(pm_map, "bounds_changed", function(event) {
			var maxZoom = ' . $this->getSetting('GM_MAX_ZOOM') . ';
			if (this.getZoom() > maxZoom) {
				this.setZoom(maxZoom);
			}
		});

		// Close the sidebar highlight when the infowindow is closed
		google.maps.event.addListener(infowindow, "closeclick", function() {
			jQuery(".gm-ancestor[data-marker=" + lastlinkid + "]").toggleClass("gm-ancestor-visited person_box");
			lastlinkid = null;
		});
		// put the assembled gm_ancestors_html contents into the gm-ancestors div
		document.querySelector(".gm-ancestors").innerHTML = gm_ancestors_html;

		jQuery(".gm-ancestor-link")
			.on("click", "a", function(e) {
				e.stopPropagation();
			})
			.on("click", function(e) {
				if (lastlinkid != null) {
					jQuery(".gm-ancestor[data-marker=" + lastlinkid + "]").toggleClass("person_box gm-ancestor-visited");
				}
				var target = jQuery(this).closest(".gm-ancestor").data("marker");
				google.maps.event.trigger(gmarkers[target], "click");
			});
		';
        return $js;
    }