Latest Contributions by Henryobaseki

‎07-26-2017

Hi All It just tool complicated to use external service within Esri JavaScript API. I have opted for Esri geocoding service instead it gives me what I need an xy coordinates with addresses. Thanks...

‎07-25-2017

Hi All, Figured how it works pretty similar to the 3,21. Tested the code in 4.4 and it works! Thank you

‎07-25-2017

Hi All, I m trying to use to search widget to search addresses from Esri geocoding service and also from two layer. Similar to the sample in 3.21https://developers.arcgis.com/javascript/3/jssamples/search_multiplesources.html I have added the locator with the two feature Layers and doesn't seem to be working. Thanks in advance <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"> <title>Search Widget 3D - 4.4</title> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <link rel="stylesheet" href="https://js.arcgis.com/4.4/esri/css/main.css"> <script src="https://js.arcgis.com/4.4/"></script> <script> require([ "esri/Map", "esri/views/SceneView", "esri/widgets/Search", "esri/layers/FeatureLayer", "esri/symbols/PictureMarkerSymbol", "esri/config", "dojo/domReady!" ], function ( Map, SceneView, Search, FeatureLayer, PictureMarkerSymbol, esriConfig) { esriConfig.request.corsEnabledServers.push("cdn4.iconfinder.com"); var map = new Map({ basemap: "satellite", ground: "world-elevation" }); var view = new SceneView({ scale: 123456789, container: "viewDiv", map: map }); var locatorUrl = new Locator({ url: "http://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer", popupTemplate: { // autocasts as new popupTemplate() title: "Post Code: ${Postcode}</br>UPRN: ${UPRN}</br>ADDRESS: ${ADDRESS}", overwriteActions: true } }) var featureSource1 = new FeatureLayer({ url: "https://services7.arcgis.com/uE69mPI6U3rpSmCT/arcgis/rest/services/aAdd_csv/FeatureServer/0", popupTemplate: { // autocasts as new popupTemplate() title: "Post Code: ${Postcode}</br>UPRN: ${UPRN}</br>ADDRESS: ${ADDRESS}", overwriteActions: true } }) var featureSource2 = new FeatureLayer({ url: "https://services7.arcgis.com/uE69mPI6U3rpSmCT/arcgis/rest/services/postcodesS/FeatureServer/0", popupTemplate: { // autocasts as new popupTemplate() title: "Post Code: ${Postcode_3}</br>Wards Name: ${Ward_Name}</br>Ward: ${Ward_Code}", overwriteActions: true } }) var searchWidget = new Search({ view: view, sources: [ { //Pass in the custom locator to the sources locator: new Locator(locatorUrl), singleLineFieldName: "DataID", outFields: ["Match_addr"], name: "Address_search", //Create an InfoTemplate infoTemplate: new InfoTemplate("DataID", "ID: ${Match_addr}") } { featureLayer: featureSource1, searchFields: ["Postcode", "UPRN"], displayField: "Postcode", exactMatch: false, outFields: ["*"], name: "Postcode", placeholder: "example: CM2 0HU", resultSymbol: new PictureMarkerSymbol({ url: "https://cdn4.iconfinder.com/data/icons/pixel-perfect-at-24px-volume-2/24/2206-128.png", height: 36, width: 36 }) }, { featureLayer: featureSource2, searchFields: ["Postcode_3", "Ward_Name"], name: "PostCode", exactMatch: false, displayField: "Postcode_3", placeholder: "example: ...", outFields: ["*"] }] }); console.log(document.getElementById("submitButton")) document.getElementById("submitButton").onclick = (e) => { e.preventDefault() let el = document.getElementById("input") console.log(el.value) searchWidget.search(el.value).then((result) => { console.log("result", result) }) } }); </script> </head> <body> <div> <form> <input placeholder="Enter your address" type="text" id="input"> <button id="submitButton">Submit</button> </form> </div> <div id="viewDiv"></div> </body> </html>

‎07-25-2017

It wont load Map because I think I m running the app from a c drive. How do I run it from a web server I think this should resolve the issue any hints please?

‎07-25-2017

Thanks Kelly Hutchins, I think its the browser I m using need it to be displayed in IE and not google chrome. Any ideas?

‎07-25-2017

Hi All, The code would normally work using Javascript 4.3, my search widget outside my mapView but seems not to be working in 4.4. Any help please. Thanks I advance <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"> <title>Search Widget - 4.4</title> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <link rel="stylesheet" href="https://js.arcgis.com/4.4/esri/css/main.css"> <script src="https://js.arcgis.com/4.4/"></script> <script> require([ "esri/Map", "esri/views/SceneView", "esri/widgets/Search", "dojo/domReady!" ], function( Map, SceneView, Search) { var map = new Map({ basemap: "satellite", ground: "world-elevation" }); var view = new SceneView({ scale: 123456789, container: "viewDiv", map: map }); var searchWidget = new Search({ view: view }); // Add the search widget to the very top left corner of the view console.log(document.getElementById("submitButton")) document.getElementById("submitButton").onclick = (e)=> { e.preventDefault() let el = document.getElementById("input") console.log(el.value) searchWidget.search(el.value).then((result)=> { console.log("result", result) }) } }); </script> </head> <body> <div> <form> <input placeholder="Enter your address" type="text" id="input"> <button id="submitButton">Submit</button> </form> </div> <div id="viewDiv"></div> </body> </html>

‎07-11-2017

The json format you showed is for one entity or location. I do have a search widget jean Marc Roy helped with this; see link below https://community.esri.com/external-link.jspa?url=https%3A%2F%2Fplnkr.co%2Fedit%2FcJr3F4OWjVeseUf8LjKS%3Fp%3Dpreview ==================================================================================================== Searches coming from different featureservers. var featureSource1 = new FeatureLayer({ url: "https://services7.arcgis.com/uE69mPI6U3rpSmCT/arcgis/rest/services/aAdd_csv/FeatureServer/0", popupTemplate: { // autocasts as new popupTemplate() title: "Post Code: ${Postcode}</br>UPRN: ${UPRN}</br>ADDRESS: ${ADDRESS}", overwriteActions: true } }) var featureSource2 = new FeatureLayer({ url: "https://services7.arcgis.com/uE69mPI6U3rpSmCT/arcgis/rest/services/postcodesS/FeatureServer/0", popupTemplate: { // autocasts as new popupTemplate() title: "Post Code: ${Postcode_3}</br>Wards Name: ${Ward_Name}</br>Ward: ${Ward_Code}", overwriteActions: true } ============================================================================================================ I would like my third source, if possible would like the only source to come from googleApi. I guess when a user types in an address in the search it returns the json format as a lookup and then displaces it on the map. ================================================================================================================== here is my google map key https://maps.googleapis.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&key=AIzaSyA2bvB4bQ-ofc_qVFVM-XWsTeyMNwuh744 Thanks in advance

‎07-09-2017

Hi All, Do not know if anyone has worked with Google places api or OSplaces api.all similar to Esri javascript api. I would like to include Google search places api as a function or sources in my search widget code. Don't really know the best way to go about this though. Google Api search function https://developers.google.com/maps/documentation/javascript/examples/geocoding-simple <script> function initMap() { var map = new google.maps.Map(document.getElementById('map'), { zoom: 8, center: {lat: -34.397, lng: 150.644} }); var geocoder = new google.maps.Geocoder(); document.getElementById('submit').addEventListener('click', function() { geocodeAddress(geocoder, map); }); } function geocodeAddress(geocoder, resultsMap) { var address = document.getElementById('address').value; geocoder.geocode({'address': address}, function(results, status) { if (status === 'OK') { resultsMap.setCenter(results[0].geometry.location); var marker = new google.maps.Marker({ map: resultsMap, position: results[0].geometry.location }); } else { alert('Geocode was not successful for the following reason: ' + status); } }); } </script I want the google search api to carry out the address searches when a user click on a search button to search a post code for example but I want the search result to be displaced on ESri map. How do I include google api search to the searchWidget sample below ESRI Search Widget( its also a geocoding service on its own) <script> require([ "esri/Map", "esri/views/SceneView", "esri/widgets/Search", "dojo/domReady!" ], function( Map, SceneView, Search) { var map = new Map({ basemap: "satellite", ground: "world-elevation" }); var view = new SceneView({ scale: 123456789, container: "viewDiv", map: map }); var searchWidget = new Search({ view: view }); // Add the search widget to the very top left corner of the view view.ui.add(searchWidget, { position: "top-left", index: 0 }); }); </script> The other option will be to the search widget multiple sources option, how do I call the google api function on its on without including google map function initMap. Thanks for all your help...

‎07-03-2017

Thank you, its working...

‎07-03-2017

Hi Jean-Marc Roy, One more thing Do have multiple search sources to pass to my widget, it does work on a different html, its just how to incorporate it to my above code if you could please test in using the Plunker Thank you! var searchWidget = new Search({ view: view, allPlaceholder: "District or Senator", sources: [{ featureLayer: new FeatureLayer({ url: "https://services7.arcgis.com/uE69mPI6U3rpSmCT/arcgis/rest/services/aAdd_csv/FeatureServer/0", popupTemplate: { // autocasts as new popupTemplate() title: "Post Code: ${Postcode}</br>UPRN: ${UPRN}</br>ADDRESS: ${ADDRESS}", overwriteActions: true } }), searchFields: ["Postcode", "UPRN"], displayField: "Postcode", exactMatch: false, outFields: ["Postcode", "UPRN", "ADDRESS"], name: "Postcode", placeholder: "example: CM2 0HU", }, { featureLayer: new FeatureLayer({ url: "https://services7.arcgis.com/uE69mPI6U3rpSmCT/arcgis/rest/services/postcodesS/FeatureServer/0", popupTemplate: { // autocasts as new popupTemplate() title: "Post Code: ${Postcode_3}</br>Wards Name: ${Ward_Name}</br>Ward: ${Ward_Code}", overwriteActions: true } }), searchFields: ["Postcode_3", "Ward_Name"], suggestionTemplate: "{Postcode_3}, Ward_Name: {Ward_Nmae}", exactMatch: false, outFields: ["*"], name: "Postcode", zoomScale: 50, resultSymbol: new PictureMarkerSymbol({ url: "images/senate.png", height: 36, width: 36 }) }] });

‎07-03-2017

Thanks Jean, Tried the code it works! Thank you

‎07-02-2017

Hi All, The code would normally work using Javascript 4.3, my search widget outside my mapView but seems not to be working in 4.4. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no"> <title>Search Widget - 4.4</title> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <link rel="stylesheet" href="https://js.arcgis.com/4.4/esri/css/main.css"> <script src="https://js.arcgis.com/4.4/"></script> <script> require([ "esri/Map", "esri/views/SceneView", "esri/widgets/Search", "dojo/domReady!" ], function( Map, SceneView, Search) { var map = new Map({ basemap: "satellite", ground: "world-elevation" }); var view = new SceneView({ scale: 123456789, container: "viewDiv", map: map }); var searchWidget = new Search({ view: view }); // Add the search widget to the very top left corner of the view console.log(document.getElementById("submitButton")) document.getElementById("submitButton").onclick = (e)=> { e.preventDefault() let el = document.getElementById("input") console.log(el.value) searchWidget.search(el.value).then((result)=> { console.log("result", result) }) } }); </script> </head> <body> <div> <form> <input placeholder="Enter your address" type="text" id="input"> <button id="submitButton">Submit</button> </form> </div> <div id="viewDiv"></div> </body> </html> Thanks in advance

‎06-28-2017

Hi Jean, Thanks, My search widget is outside my mapview. I think there is default styling with the widget is there a way of customising the style ? Thanks anyways, my previous query was answered.

‎06-28-2017

user name was the issue

‎06-28-2017

Hi All, My search widget is working fine in my mapview. But I would like it outside my mapview, to be parsed or embedded in the search form I have created in html, so I'm able to do the search in the form rather than the search widget.in my map. Thanks for your help.. see the code below; SearchWidget and Div form for search var searchWidget = new Search({ view: view1 }); searchWidget.startup(); // Add the search widget to the top left corner of the view view1.ui.add(searchWidget, { position: "top-right", index: 0 }); <form action "" = id="searchWidget" style="float: left" > <input type="text" name="q" value="Postcode or address" title="Postcode or address" size="21" maxlength="120"><input type="submit" value="search" class="tfbutton"> <div id="searchWidget"></div> </form> <div class="tfclear">

Online Status	Offline
Date Last Visited	‎11-11-2020 02:24 AM

My Ideas

Latest Contributions by Henryobaseki

Re: call google api as a function in my search widget

Re: Search Widget Mulitple sources in 4.4

Search Widget Mulitple sources in 4.4

Re: parse search widget 4.4 to a html search form

Re: parse search widget 4.4 to a html search form

parse search widget 4.4 to a html search form

Re: call google api as a function in my search widget

call google api as a function in my search widget

Re: parse search widget to a html search form

Re: parse search widget to a html search form

Re: parse search widget to a html search form

parse search widget 4.4 to a html search form

Re: Search Widget outside Map View

Re: Access hosted arcgis online featureLayer via html

Search Widget outside Map View

Re: update attribute table from another table base...

Update attribute table using Arcpy