Hi All,
I am interested in the sql query tools and found query_feature_service.html (written by Allan Laframboise) related to the sql query on a feature layer. I am wondering if anyone has modified this script into Legacy not AMD module. Could you please share your script if you have done this job?
Thanks,
Hank
Solved! Go to Solution.
Hank,
Just FYI Legacy style will not be supported in 4.x of the JS API. You really ought to be working on updating all your code to AMD.
Hank,
Just FYI Legacy style will not be supported in 4.x of the JS API. You really ought to be working on updating all your code to AMD.
Hi Robert,
Thank you for the opinion. I have modified the AMD to Legacy version. Then I found an error listed below. Please give some opinions.
Thanks,
Hi all,
I tried to modified the legacy version of query_feature_service.html to the legacy version. However, the Web Console in the Firefox gives me the TypeError:esri.symbols is undefined. However, I have created the modules such as dojo.require("esri.symbol") and dojo.require("esri.symbols.PictureMarkerSymbol") in my script. Please let me know if you all have any opinions.
Thanks,
Hank
Hank,
Still not sure why you would want to go backwards to legacy style that will be obsolete probably this year, but here is your code with the fixes.
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" /> <title>NMWebMap</title> <style type="text/css"> </style> <link rel="stylesheet" type="text/css" href="style.css"> <link rel="stylesheet" type="text/css" href="http://js.arcgis.com/3.10/js/dojo/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" type="text/css" href="http://js.arcgis.com/3.10/js/esri/css/esri.css" /> <link rel="shortcut icon" href="http://esri.github.io/quickstart-map-js/images/favicon.ico"> <script type="text/javascript"> var djConfig = { parseOnLoad: true }; </script> </script> <script src="http://js.arcgis.com/3.10/"> </script> <script type="text/javascript"> dojo.require("esri.symbol"); dojo.require("esri.symbols.PictureMarkerSymbol"); dojo.require("esri.symbols.MarkerSymbol"); dojo.require("esri.dijit.Print"); dojo.require("esri.tasks.PrintTask"); dojo.require("esri.tasks.PrintTemplate"); dojo.require("esri.tasks.LegendLayer") dojo.require("dojo.promise.all"); dojo.require("dojo.DeferredList"); dojo.require("dojox.layout.ExpandoPane"); dojo.require("dojo.parser"); dojo.require("dijit.Dialog"); // PopOut information //dojo.require("agsjs.dijit.TOC"); // Table of Content dojo.require("esri.tasks.identify"); //InfoWindow dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.layout.TabContainer"); //InfoWindow dojo.require("dijit.form.Button"); //InfoWindow dojo.require("esri.tasks.geometry"); //InfoWindow dojo.require("esri.map"); dojo.require("esri.dijit.Scalebar"); dojo.require("dijit.form.Slider"); dojo.require("dijit.TitlePane"); dojo.require("esri.utils"); dojo.require("esri.dijit.Geocoder"); dojo.require("esri.IdentityManager"); dojo.require("esri.tasks.query"); //Query Rockinfo dojo.require("dijit.Tooltip"); dojo.require("esri.toolbars.navigation"); //Navigation tool dojo.require("dijit.Toolbar"); //Navigation tool dojo.require("esri.layers.FeatureLayer"); dojo.require("esri.toolbars.draw"); dojo.require("esri.dijit.Popup"); dojo.require("esri.SnappingManager"); dojo.require("esri.dijit.Legend"); dojo.require("esri.dijit.BasemapGallery"); dojo.require("dojo.number"); dojo.require("dijit.form.CheckBox"); dojo.require("dijit.form.FilteringSelect"); dojo.require("dijit.form.TextBox"); dojo.require("dijit.form.Select"); dojo.require("dijit.form.ComboBox"); dojo.require("esri.layers.agstiled"); dojo.require("esri.layers.ArcGISImageServiceLayer"); dojo.require("esri.renderers.SimpleRenderer") </script> <script language="javascript" src="universal_jsAPI.js"></script> <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.8/dojox/layout/resources/ExpandoPane.css"> <script type="text/javascript"> var map, toc, basemap, dynaLayer1, featLayer1, id_connect; var identifyTask, identifyParams, basemapGallery, query, symbol, idPoint; <!-- These variables for InfoWindow--> var ventslayer, mapboundarylayer, lithologiclayer, faultlayer, dikeslayer, geologiclayer, countylayer, popup, idParams; var legendLayers = []; var visible = []; var gLayers = new Array(); //Global variable for layer definitions var gSearchLayerIndex; var featurelayer; function init() { esriConfig.defaults.io.proxyUrl = "http://maps.nmt.edu/DotNet/proxy.ashx"; esriConfig.defaults.io.alwaysUseProxy = false; idParams = new esri.tasks.IdentifyParameters(); //define custom popup options var popupOptions = { 'markerSymbol': new esri.symbol.SimpleMarkerSymbol('circle', 22, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255, 0, 0]), 2), new dojo.Color([0, 0, 0, 0.25])), 'fillSymbol': new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255, 0, 0]), 2), new dojo.Color([255, 255, 0, 0.5])), 'lineSymbol': new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([0, 255, 0]), 2), 'marginLeft': '20', 'marginTop': '20' }; //create a popup to replace the map's info window popup = new esri.dijit.Popup(popupOptions, dojo.create("div")); map = new esri.Map("map", { basemap: "topo", center: [-106.9048, 34.0665], zoom: 5, infoWindow: popup, allowKineticScrolling: false, showAttribution: false, wrapAround180: true, sliderStyle: "large" }); dojo.connect(btnClear, "click", function () { clearCloudGraphics() }); dojo.connect(selCountry, "change", function () { searchBySQL() }); dojo.connect(btnAddCities, "click", function () { Addfeaturelayer() }); } function Addfeaturelayer() { if (featurelayer) { return; } featurelayer = new esri.layers.FeatureLayer("http://services.arcgis.com/oKgs2tbjK6zwTdvi/arcgis/rest/services/Major_World_Cities/FeatureServer/0", { mode: esri.layers.FeatureLayer.MODE_ONDEMAND, outFields: ["*"], opacity: .90 }); var symbol = createPictureSymbol("http://esri.github.io/quickstart-map-js/images/blue-pin.png", 0, 12, 13, 24); featurelayer.renderer = new esri.renderer.SimpleRenderer(symbol) featurelayer.setSelectionSymbol(selectSymbol); var selectSymbol = createPictureSymbol("http://esri.github.io/quickstart-map-js/images/red-pin.png", 0, 12, 13, 24); featurelayer.setSelectionSymbol(selectSymbol); map.addLayer(featurelayer); // Connect to selection event dojo.connect(featurelayer, "selection-complete", function (results) { var features = results.features; var extent; for (var i = 0; i < features.length; i++) { if (!extent) extent = features._extent; else extent.union(features._extent); } if (extent) { map.setExtent(extent); } }); var element = dojo.byId('selCountry'); element.disabled = false; }; function createPictureSymbol(url, xOffset, yOffset, xWidth, yHeight) { return new esri.symbol.PictureMarkerSymbol({ "angle": 0, "xoffset": xOffset, "yoffset": yOffset, "type": "esriPMS", "url": url, "contentType": "image/png", "width": xWidth, "height": yHeight }); } function searchBySQL() { if (!featurelayer) { return; } var element = dojo.byId('selCountry'); var sql = element.options[element.selectedIndex].value; var query = esri.tasks.Query(); query.where = sql; featurelayer.selectFeatures(query, faultlayer.SELECTION_NEW) //this bracket is for the init } // Clear selected graphics function clearCloudGraphics() { if (featurelayer) { map.removeLayer(featurelayer); } featurelayer = null; } dojo.ready(init); </script> </head> <body class="tundra"> <div class="panel panel-primary panel-fixed"> <div class="panel-heading"> <h3 class="panel-title">Query Feature Service</h3> </div> <div class="panel-body"> <div class="form-group"> <select class="form-control" id="selCountry" disabled> <option selected value="1=0">Select by country</option> <option value="COUNTRY = 'US'">COUNTRY = 'US'</option> <option value="COUNTRY = 'Canada'">COUNTRY = 'Canada'</option> <option value="COUNTRY = 'France'">COUNTRY = 'France'</option> <option value="COUNTRY = 'Australia'">COUNTRY = 'Australia'</option> <option value="COUNTRY = 'Brazil'">COUNTRY = 'Brazil'</option> </select> </div> <button class="btn btn-success" id="btnAddCities">Add World Cities</button> <button class="btn btn-default" id="btnClear">Clear</button> </div> </div> <div id="map"></div> </body> </html>