SQL Query in query_feature_service.html

Chang-HengYang — Fri, 20 Mar 2015 17:43:55 GMT

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

Re: SQL Query in query_feature_service.html

RobertScheitlin__GISP — Fri, 20 Mar 2015 18:13:57 GMT

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.

Re: SQL Query in query_feature_service.html

Chang-HengYang — Thu, 26 Mar 2015 22:10:47 GMT

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

Re: SQL Query in query_feature_service.html

RobertScheitlin__GISP — Sat, 11 Dec 2021 23:16:53 GMT

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>

topic Re: SQL Query in query_feature_service.html in ArcGIS JavaScript Maps SDK Questions

SQL Query in query_feature_service.html

Re: SQL Query in query_feature_service.html

Re: SQL Query in query_feature_service.html

Re: SQL Query in query_feature_service.html