<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="Content-Type">
</head>
<body bgcolor="#FFFFFF" text="#000000">
Remove the renderTo config options. They are not needed and will
actually interfere with the viewport's border layout logic.<br>
<br>
Matt Priour<br>
OpenGeo<br>
<br>
On 2/15/2012 6:24 AM, Francesc Cañas wrote:
<blockquote
cite="mid:CA+7Veh5+zVT0sMeUkMRRwS4wn_xGVZ4Ugo6PTyyxUV55p=hafQ@mail.gmail.com"
type="cite">Hi,
<div>Following the tree tutorial I've created a map with a
layerTree, It works but I want the tree in the west region and
map at center, but instead of this, all is displayed at left
side with the tree up the map. What I'm doing wrong?</div>
<div><br>
</div>
<div>Thanks a lot!</div>
<div><br>
</div>
<div><br>
</div>
<div>The whole code is:</div>
<div><br>
</div>
<div>
<div><html></div>
<div><head></div>
<div><br>
</div>
<div><title> Projectes AUMA </title></div>
<div><script src="ext-3.3.1/adapter/ext/ext-base.js"
type="text/javascript"></script></div>
<div><script src="ext-3.3.1/ext-all.js"
type="text/javascript"></script></div>
<div><link rel="stylesheet" type="text/css"
href="ext-3.3.1/resources/css/ext-all.css"></link></div>
<div><script src="OpenLayers/OpenLayers.js"
type="text/javascript"></script></div>
<div><script src="GeoExt/lib/GeoExt.js"
type="text/javascript"></script></div>
<div><link rel="stylesheet" type="text/css"
href="GeoExt/resources/geoext-all-debug.css"></link></div>
<div><br>
</div>
<div><script type="text/javascript"></div>
<div><br>
</div>
<div><br>
</div>
<div>var mapPanel, tree;</div>
<div>Ext.onReady(function() {</div>
<div> // create a map panel with some layers that we will
show in our layer tree</div>
<div> // below.</div>
<div> </div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>mapPanel
= new GeoExt.MapPanel({</div>
<div> border: true,</div>
<div> region: "center",</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>map:
new OpenLayers.Map(),</div>
<div> renderTo: 'gxmap',</div>
<div> height: 500,</div>
<div> width: 800,</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>title:
'Projectes AUMA',</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>zoom:
4,</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>center:
new OpenLayers.LonLat (-3,38),</div>
<div> layers: [</div>
<div>
new OpenLayers.Layer.WMS(</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>"World",
"<a moz-do-not-send="true"
href="http://www.opengis.uab.es/cgi-bin/world/MiraMon.cgi">http://www.opengis.uab.es/cgi-bin/world/MiraMon.cgi</a>?",</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>{</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>layers:['BlueMarble_NG','admin_level1-world']</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>},
{</div>
<div> buffer: 0,</div>
<div> visibility: false</div>
<div> }</div>
<div> ),</div>
<div> </div>
<div> new OpenLayers.Layer.WMS(</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>"Projectes
UTM31",</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>"<a
moz-do-not-send="true"
href="http://localhost:8080/geoserver/AUMA/wms">http://localhost:8080/geoserver/AUMA/wms</a>",</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>{</div>
<div> layers: 'AUMA:Projectes_UTM31',</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>
transparent:true,</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>
format: 'image/png'},</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>
{</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>
isBaseLayer:false, </div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>
buffer: 0</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>}</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>),</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>new
OpenLayers.Layer.WMS(</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>"Projectes
UTM30",</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>"<a
moz-do-not-send="true"
href="http://localhost:8080/geoserver/AUMA/wms">http://localhost:8080/geoserver/AUMA/wms</a>",</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>{</div>
<div> layers: 'AUMA:Projectes_Esp',</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>
transparent:true,</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>
format: 'image/png'},</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>
{</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>
isBaseLayer:false,</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>
buffer: 0</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>}</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>)</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span></div>
<div> </div>
<div> </div>
<div> ]</div>
<div> });</div>
<div><br>
</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>var
LayerNodeUI = Ext.extend(GeoExt.tree.LayerNodeUI, new
GeoExt.tree.TreeNodeUIEventMixin());</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span></div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>var
treeConfig = [{</div>
<div> nodeType: "gx_baselayercontainer"</div>
<div> }, {</div>
<div> nodeType: "gx_overlaylayercontainer",</div>
<div> expanded: true,</div>
<div> // render the nodes inside this container with a
radio button,</div>
<div> // and assign them the group "foo".</div>
<div> loader: {</div>
<div> baseAttrs: {</div>
<div> radioGroup: "foo",</div>
<div> uiProvider: "layernodeui"</div>
<div> }</div>
<div> }</div>
<div> }];</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span></div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>var
layerList = new GeoExt.tree.LayerContainer({</div>
<div> text: 'Capes',</div>
<div> layerStore: mapPanel.layers,</div>
<div> leaf: false,</div>
<div> expanded: true</div>
<div>});</div>
<div><br>
</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>var
layerTree = new Ext.tree.TreePanel({</div>
<div> title: 'Map Layers',</div>
<div> renderTo: 'layerTree',</div>
<div> root: layerList,<span class="Apple-tab-span"
style="white-space:pre"> </span></div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>border:
true,</div>
<div> region: "west",</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>width:
200,</div>
<div> split: true,</div>
<div> collapsible: true,</div>
<div> collapseMode: "mini",</div>
<div> autoScroll: true,</div>
<div> plugins: [</div>
<div> new GeoExt.plugins.TreeNodeRadioButton({</div>
<div> listeners: {</div>
<div> "radiochange": function(node) {</div>
<div> alert(node.text + " is now the
active layer.");</div>
<div> }</div>
<div> }</div>
<div> })</div>
<div> ],</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>loader:
new Ext.tree.TreeLoader({</div>
<div> // applyLoader has to be set to false to not
interfer with loaders</div>
<div> // of nodes further down the tree hierarchy</div>
<div> applyLoader: false,</div>
<div> uiProviders: {</div>
<div> "layernodeui": LayerNodeUI</div>
<div> }</div>
<div> }),</div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>listeners:
{</div>
<div> "radiochange": function(node){</div>
<div> alert(<a moz-do-not-send="true"
href="http://node.layer.name">node.layer.name</a> + " is now
the the active layer.");</div>
<div> }</div>
<div> },<span class="Apple-tab-span"
style="white-space:pre"> </span></div>
<div><span class="Apple-tab-span" style="white-space:pre"> </span>rootVisible:
false,</div>
<div> lines: false<span class="Apple-tab-span"
style="white-space:pre"> </span></div>
<div>});</div>
<div><br>
</div>
<div>new Ext.Viewport({</div>
<div> layout: "fit",</div>
<div> hideBorders: true,</div>
<div> items: {</div>
<div> layout: "border",</div>
<div> deferredRender: false,</div>
<div> items: [mapPanel, layerTree, {</div>
<div> contentEl: "desc",</div>
<div> region: "east",</div>
<div> bodyStyle: {"padding": "5px"},</div>
<div> collapsible: true,</div>
<div> collapseMode: "mini",</div>
<div> split: true,</div>
<div> width: 200,</div>
<div> title: "Description"</div>
<div> }]</div>
<div>
}</div>
<div> });</div>
<div><br>
</div>
<div> </div>
<div>});</div>
<div><br>
</div>
<div></script></div>
<div></head></div>
<div><body></div>
<div><br>
</div>
<div><div id="gxmap"></div></div>
<div><div id="layerTree"></div></div>
<div><br>
</div>
<div><br>
</div>
<div></body></div>
<div></html></div>
</div>
<div><br>
</div>
<div><br clear="all">
<div><br>
</div>
-- <br>
<a moz-do-not-send="true" href="http://kikocanas.blogspot.com"
target="_blank">http://kikocanas.blogspot.com</a><br>
</div>
<br>
<fieldset class="mimeAttachmentHeader"></fieldset>
<br>
<pre wrap="">_______________________________________________
Users mailing list
<a class="moz-txt-link-abbreviated" href="mailto:Users@geoext.org">Users@geoext.org</a>
<a class="moz-txt-link-freetext" href="http://www.geoext.org/cgi-bin/mailman/listinfo/users">http://www.geoext.org/cgi-bin/mailman/listinfo/users</a>
</pre>
<br>
<fieldset class="mimeAttachmentHeader"></fieldset>
<br>
<p class="" avgcert""="" color="#000000" align="left">No virus
found in this message.<br>
Checked by AVG - <a moz-do-not-send="true"
href="http://www.avg.com">www.avg.com</a><br>
Version: 2012.0.1913 / Virus Database: 2112/4809 - Release Date:
02/14/12</p>
</blockquote>
</body>
</html>