DHTMLX Docs & Samples Explorer

Example (Google Maps)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--conf
<sample in_favorites="true">
              <product version="1.0" edition="std"/>
                     <modifications>
                            <modified date="080606"/>
                     </modifications>
               <sampledescription><![CDATA[Since dhtmlx 2.0 you can attach any dhtmlx component to dhtmlxLayout panel with just single script command. See how easely dhtmlxTree can be attached in this sample. You also can see samples with Accordion, Grid, TreeGrid, Tabbar, Toolbar, Menu, Folders.]]></sampledescription></sample>
 --> 
<html>
<head>
	<title>Attach Google Maps to Layout</title>
	<link rel="stylesheet" type="text/css" href="../../codebase/dhtmlxlayout.css">
	<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxlayout_dhx_skyblue.css">
	<script src="../../codebase/dhtmlxcommon.js"></script>
	<script src="../../codebase/dhtmlxlayout.js"></script>
 
	<script src="../../codebase/dhtmlxcontainer.js"></script>
	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
</head>
<body onload="doOnLoad();">
	<div id="parentId" style="position: relative; top: 20px; left: 20px; width: 600px; height: 400px; aborder: #B5CDE4 1px solid;"></div>
 
<script>
	var dhxLayout, GMaps;
	function doOnLoad() {
		dhxLayout = new dhtmlXLayoutObject("parentId", "2U");
		dhxLayout.cells("a").setWidth(120);
		GMaps = dhxLayout.cells("b").attachGoogleMaps();
 
	}
</script>
</body>
</html>