Can someone please help me with this error I have in GeoExt:
I've used this code http://geoext.org/tutorials/layertree-tutorial.html / "Layer Nodes with Additional Radio Buttons" But the page is not loading. Here is the error
expected expression, got keyword 'if'
Here is my code:
* Copyright (c) 2008-2014 The Open Source Geospatial Foundation * * Published under the BSD license. * See https://github.com/geoext/geoext2/blob/master/license.txt for the full * text of the license. *//** api: example[legendpanel] * Legend Panel * ------------ * Display a layer legend in a panel. */var mapPanel, legendPanel, tree;Ext.require([ 'Ext.container.Viewport', 'Ext.layout.container.Border', 'GeoExt.panel.Map', 'GeoExt.container.WmsLegend', 'GeoExt.container.UrlLegend', 'GeoExt.container.VectorLegend', 'GeoExt.panel.Legend', 'GeoExt.window.Popup', 'Ext.layout.container.Accordion', 'Ext.grid.property.Grid', 'GeoExt.slider.LayerOpacity', 'GeoExt.slider.Tip', 'GeoExt.tree.OverlayLayerContainer', 'GeoExt.tree.BaseLayerContainer', 'GeoExt.data.LayerTreeModel', 'GeoExt.tree.Panel', 'GeoExt.tree.LayerContainer', 'Ext.tree.TreePanel']);Ext.application({ name: 'LegendPanel GeoExt2', launch: function() { var map = new OpenLayers.Map({ allOverlays: true,projection: new OpenLayers.Projection("EPSG:900913"), displayProjection: new OpenLayers.Projection("EPSG:4326") }); map.addLayers([ new OpenLayers.Layer.Google( "Google Hybrid", {type: google.maps.MapTypeId.HYBRID, numZoomLevels:50}), harta=new OpenLayers.Layer.WMS( "Tarla", "http://localhost:8080/geoserver/Buesti/wms", {layers: 'Buesti:Tarlale',transparent: true, format: 'image/png'}, {isBaseLayer: false, opacity: 0.9} ), drumuri=new OpenLayers.Layer.WMS( "Drumuri", "http://localhost:8080/geoserver/Buesti/wms", {layers: 'Buesti
rumuri',transparent: true, format: 'image/png'}, {isBaseLayer: false, opacity: 0.9} ), Parcele=new OpenLayers.Layer.WMS( "Parcele", "http://localhost:8080/geoserver/Buesti/wms", {layers: 'Buestiarcele_WGS',transparent: true, format: 'image/png'}, {isBaseLayer: false, opacity: 0.9} ) ]); //tree layere /*var store = Ext.create('Ext.data.TreeStore', { model: "GeoExt.data.LayerTreeModel", root: { expanded: true, children: [{ plugins: ['gx_overlaylayercontainer'], expanded: true }] } }); tree = Ext.create('GeoExt.tree.Panel', { border: true, region: "west", title: "Layers", width: 200, split: true, store: store, collapsible: true, collapseMode: "mini", autoScroll: true, rootVisible: false, lines: false });*/ //tree end // create a separate slider bound to the map but displayed elsewhere slider = Ext.create('GeoExt.slider.LayerOpacity', { layer: harta, aggressive: true, width: 200, isFormField: true, inverse: true, fieldLabel: "Transparenta", renderTo: "slider", plugins: Ext.create("GeoExt.slider.Tip", { getText: function(thumb) { return Ext.String.format('Transparency: {0}%', thumb.value); } }) }); mapPanel = Ext.create('GeoExt.panel.Map', { region: 'center', height: 600, width: 600, map: map, center: new OpenLayers.LonLat(24.9852,45.862275).transform(new OpenLayers.Projection("EPSG:4326"), new OpenLayers.Projection("EPSG:900913")), zoom: 7 }); var layerList = new GeoExt.tree.LayerContainer({ text: 'All Layers', layerStore: mapPanel.layers, leaf: false, expanded: true, loader: { baseAttrs: { radioGroup: "active" } }});var registerRadio = function(node) if(!node.hasListener("radiochange")) { node.on("radiochange", function(node){ /* set your active layer here */ }); }} var tree = new Ext.tree.TreePanel({ title: 'Map Layers', renderTo: 'layerTree', root: layerList, listeners: { append: registerRadio, insert: registerRadio }}); //geat feature infovar gfiControl = new OpenLayers.Control.WMSGetFeatureInfo({ autoActivate: true, drillDown: true, infoFormat: "application/vnd.ogc.gml", maxFeatures: 3, eventListeners: { "getfeatureinfo": function(e) { var items = []; Ext.each(e.features, function(feature) { items.push({ xtype: "propertygrid", title: feature.fid, source: feature.attributes }); }); if (items.length > 0) { Ext.create('GeoExt.window.Popup', { title: "Feature Info", width: 500, height: 350, layout: "accordion", map: mapPanel, location: e.xy, items: items }).show(); } } }});mapPanel.map.addControl(gfiControl);//end get feature info//geolocation startnavigator.geolocation.watchPosition(function(position) { document.getElementById('anzeige').innerHTML="Latitude: " + position.coords.latitude + " Longitude: " + position.coords.longitude + "
"; var lonLat = new OpenLayers.LonLat(position.coords.longitude, position.coords.latitude) .transform( new OpenLayers.Projection("EPSG:4326"), //transform from WGS 1984 map.getProjectionObject() //to Spherical Mercator Projection ); markers.addMarker(new OpenLayers.Marker(lonLat)); // map.setCenter(lonLat, 14 // Zoom level //); }); //map = new OpenLayers.Map("basicMap"); //var mapnik = new OpenLayers.Layer.OSM(); //map.addLayer(mapnik); //map.setCenter(new //OpenLayers.LonLat(3,3) // Center of the map // .transform( // new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984 //new OpenLayers.Projection("EPSG:900913") // to Spherical Mercator Projection //), 15 // Zoom level //); var markers = new OpenLayers.Layer.Markers( "Markers" ); mapPanel.map.addLayer(markers);//geolocation stop // give the record of the 1st layer a legendURL, which will cause // UrlLegend instead of WMSLegend to be used legendPanel = Ext.create('GeoExt.panel.Legend', { defaults: { labelCls: 'mylabel', style: 'padding:5px' }, bodyStyle: 'padding:5px', width: 200, autoScroll: true, collapsible: true, collapseMode: "mini", autoScroll: true, region: 'west' }); // functions for interacting with the map's layers to show how the // legend instantly reflects changes function addRemoveLayer() { if(Ext.Array.indexOf(map.layers, busstops) == -1) { map.addLayer(busstops); } else { map.removeLayer(busstops); } } function moveLayer() { var layer = layerRec0.getLayer(); var idx = Ext.Array.indexOf(map.layers, layer) === 0 ? map.layers.length : 0; map.setLayerIndex(layerRec0.getLayer(), idx); } function toggleVisibility() { var layer = layerRec1.getLayer(); layer.setVisibility(!layer.getVisibility()); } function updateHideInLegend() { layerRec0.set("hideInLegend", !layerRec0.get("hideInLegend")); } function updateLegendUrl() { var url = layerRec0.get("legendURL"); layerRec0.set("legendURL", otherUrl); otherUrl = url; } Ext.create('Ext.panel.Panel', { layout: 'border', renderTo: 'view', width: 1400, height: 600, items: [mapPanel, legendPanel, tree], tbar: Ext.create('Ext.Toolbar', { items: [ ] }) }); }});I want to use radio button to set active layer for Transparency. Seems Heron is more easyer with activelayers and transparency.
Thank you
أكثر...
I've used this code http://geoext.org/tutorials/layertree-tutorial.html / "Layer Nodes with Additional Radio Buttons" But the page is not loading. Here is the error
expected expression, got keyword 'if'
Here is my code:
* Copyright (c) 2008-2014 The Open Source Geospatial Foundation * * Published under the BSD license. * See https://github.com/geoext/geoext2/blob/master/license.txt for the full * text of the license. *//** api: example[legendpanel] * Legend Panel * ------------ * Display a layer legend in a panel. */var mapPanel, legendPanel, tree;Ext.require([ 'Ext.container.Viewport', 'Ext.layout.container.Border', 'GeoExt.panel.Map', 'GeoExt.container.WmsLegend', 'GeoExt.container.UrlLegend', 'GeoExt.container.VectorLegend', 'GeoExt.panel.Legend', 'GeoExt.window.Popup', 'Ext.layout.container.Accordion', 'Ext.grid.property.Grid', 'GeoExt.slider.LayerOpacity', 'GeoExt.slider.Tip', 'GeoExt.tree.OverlayLayerContainer', 'GeoExt.tree.BaseLayerContainer', 'GeoExt.data.LayerTreeModel', 'GeoExt.tree.Panel', 'GeoExt.tree.LayerContainer', 'Ext.tree.TreePanel']);Ext.application({ name: 'LegendPanel GeoExt2', launch: function() { var map = new OpenLayers.Map({ allOverlays: true,projection: new OpenLayers.Projection("EPSG:900913"), displayProjection: new OpenLayers.Projection("EPSG:4326") }); map.addLayers([ new OpenLayers.Layer.Google( "Google Hybrid", {type: google.maps.MapTypeId.HYBRID, numZoomLevels:50}), harta=new OpenLayers.Layer.WMS( "Tarla", "http://localhost:8080/geoserver/Buesti/wms", {layers: 'Buesti:Tarlale',transparent: true, format: 'image/png'}, {isBaseLayer: false, opacity: 0.9} ), drumuri=new OpenLayers.Layer.WMS( "Drumuri", "http://localhost:8080/geoserver/Buesti/wms", {layers: 'Buesti
rumuri',transparent: true, format: 'image/png'}, {isBaseLayer: false, opacity: 0.9} ), Parcele=new OpenLayers.Layer.WMS( "Parcele", "http://localhost:8080/geoserver/Buesti/wms", {layers: 'Buestiarcele_WGS',transparent: true, format: 'image/png'}, {isBaseLayer: false, opacity: 0.9} ) ]); //tree layere /*var store = Ext.create('Ext.data.TreeStore', { model: "GeoExt.data.LayerTreeModel", root: { expanded: true, children: [{ plugins: ['gx_overlaylayercontainer'], expanded: true }] } }); tree = Ext.create('GeoExt.tree.Panel', { border: true, region: "west", title: "Layers", width: 200, split: true, store: store, collapsible: true, collapseMode: "mini", autoScroll: true, rootVisible: false, lines: false });*/ //tree end // create a separate slider bound to the map but displayed elsewhere slider = Ext.create('GeoExt.slider.LayerOpacity', { layer: harta, aggressive: true, width: 200, isFormField: true, inverse: true, fieldLabel: "Transparenta", renderTo: "slider", plugins: Ext.create("GeoExt.slider.Tip", { getText: function(thumb) { return Ext.String.format('Transparency: {0}%', thumb.value); } }) }); mapPanel = Ext.create('GeoExt.panel.Map', { region: 'center', height: 600, width: 600, map: map, center: new OpenLayers.LonLat(24.9852,45.862275).transform(new OpenLayers.Projection("EPSG:4326"), new OpenLayers.Projection("EPSG:900913")), zoom: 7 }); var layerList = new GeoExt.tree.LayerContainer({ text: 'All Layers', layerStore: mapPanel.layers, leaf: false, expanded: true, loader: { baseAttrs: { radioGroup: "active" } }});var registerRadio = function(node) if(!node.hasListener("radiochange")) { node.on("radiochange", function(node){ /* set your active layer here */ }); }} var tree = new Ext.tree.TreePanel({ title: 'Map Layers', renderTo: 'layerTree', root: layerList, listeners: { append: registerRadio, insert: registerRadio }}); //geat feature infovar gfiControl = new OpenLayers.Control.WMSGetFeatureInfo({ autoActivate: true, drillDown: true, infoFormat: "application/vnd.ogc.gml", maxFeatures: 3, eventListeners: { "getfeatureinfo": function(e) { var items = []; Ext.each(e.features, function(feature) { items.push({ xtype: "propertygrid", title: feature.fid, source: feature.attributes }); }); if (items.length > 0) { Ext.create('GeoExt.window.Popup', { title: "Feature Info", width: 500, height: 350, layout: "accordion", map: mapPanel, location: e.xy, items: items }).show(); } } }});mapPanel.map.addControl(gfiControl);//end get feature info//geolocation startnavigator.geolocation.watchPosition(function(position) { document.getElementById('anzeige').innerHTML="Latitude: " + position.coords.latitude + " Longitude: " + position.coords.longitude + ""; var lonLat = new OpenLayers.LonLat(position.coords.longitude, position.coords.latitude) .transform( new OpenLayers.Projection("EPSG:4326"), //transform from WGS 1984 map.getProjectionObject() //to Spherical Mercator Projection ); markers.addMarker(new OpenLayers.Marker(lonLat)); // map.setCenter(lonLat, 14 // Zoom level //); }); //map = new OpenLayers.Map("basicMap"); //var mapnik = new OpenLayers.Layer.OSM(); //map.addLayer(mapnik); //map.setCenter(new //OpenLayers.LonLat(3,3) // Center of the map // .transform( // new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984 //new OpenLayers.Projection("EPSG:900913") // to Spherical Mercator Projection //), 15 // Zoom level //); var markers = new OpenLayers.Layer.Markers( "Markers" ); mapPanel.map.addLayer(markers);//geolocation stop // give the record of the 1st layer a legendURL, which will cause // UrlLegend instead of WMSLegend to be used legendPanel = Ext.create('GeoExt.panel.Legend', { defaults: { labelCls: 'mylabel', style: 'padding:5px' }, bodyStyle: 'padding:5px', width: 200, autoScroll: true, collapsible: true, collapseMode: "mini", autoScroll: true, region: 'west' }); // functions for interacting with the map's layers to show how the // legend instantly reflects changes function addRemoveLayer() { if(Ext.Array.indexOf(map.layers, busstops) == -1) { map.addLayer(busstops); } else { map.removeLayer(busstops); } } function moveLayer() { var layer = layerRec0.getLayer(); var idx = Ext.Array.indexOf(map.layers, layer) === 0 ? map.layers.length : 0; map.setLayerIndex(layerRec0.getLayer(), idx); } function toggleVisibility() { var layer = layerRec1.getLayer(); layer.setVisibility(!layer.getVisibility()); } function updateHideInLegend() { layerRec0.set("hideInLegend", !layerRec0.get("hideInLegend")); } function updateLegendUrl() { var url = layerRec0.get("legendURL"); layerRec0.set("legendURL", otherUrl); otherUrl = url; } Ext.create('Ext.panel.Panel', { layout: 'border', renderTo: 'view', width: 1400, height: 600, items: [mapPanel, legendPanel, tree], tbar: Ext.create('Ext.Toolbar', { items: [ ] }) }); }});I want to use radio button to set active layer for Transparency. Seems Heron is more easyer with activelayers and transparency.
Thank you
أكثر...