Latest Contributions by AndyGup

‎05-04-2017

Ever wondered about using your HTML, CSS and JavaScript skills to build a desktop mapping app? Electron gives you the power to do just that. The really sweet part is that Electron, similar to hybrid web applications such Cordova, gives you access to the underlying operating system in ways that pure web apps can't. Below I've provided a fun, 5 minute lab that shows you one way to build a bare-bones prototype. I've taken the simplest approach I could think of and used plain-old vanilla JavaScript without any framework. At the end of the post there are a few links to several other approaches that you should also check out. You can definitely use the modern JavaScript framework of your choice once you get going such as Angular, Vue.js, etc. Pre-reqs - I'm assuming you already have git and node.js installed. Step 1 - Run the following commands in console, Once you run all the commands the electron-quick-start app should launch and you should have a Hello World app, booyah! If it does launch then control-c in the console to exit the app. git clone https://github.com/electron/electron-quick-start cd electron-quick-start npm install && npm start‍‍‍ Step 2 - Overwrite the index.html file by using this code instead. This is were we start bolting in the ArcGIS API for JavaScript mapping bits. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Hello World Map!</title>  <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style>  <link rel="stylesheet" href="https://js.arcgis.com/4.3/esri/css/main.css"> <script src="https://js.arcgis.com/4.3/"></script> </head> <body> <h1>Hello World Map!</h1>  We are using Node.js <script>document.write(process.versions.node)</script>, Chromium <script>document.write(process.versions.chrome)</script>, and Electron <script>document.write(process.versions.electron)</script>.  <div id="viewDiv"></div>  <script src="index.js"></script> <script> // You can also require other files to run in this process require('./renderer.js') </script> </body> </html> ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ Step 3 - Create index.js in the root directory and copy the following code. require([ "esri/Map", "esri/views/MapView", "dojo/domReady!" ], function(Map, MapView) { console.log("ArcGIS require() loaded."); var map = new Map({ basemap: "streets" }); var view = new MapView({ container: "viewDiv", map: map, zoom: 4, center: [15, 65] }); });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ Step 4 - The last step is to run npm start again and you should see a map: A few other examples using the ArcGIS API for JavaScript: Angular CLI example - GitHub - TheKeithStewart/ng-cli-electron-esri Drop Shapefiles into Electron Map - Electron with ArcGIS API for JavaScript - odoenet And, a few more resources for good measure: Electron-api-demos Electron Chrome DevTools Extension Electron: Cross-platform Desktop Apps Made Easy

‎05-04-2017

Just making sure, is this is a JavaScript app? And, are you programmatically making your own ArcGIS REST API calls for editing attachments in a feature service? If so, then attachments are handled using addAttachment, updateAttachment and deleteAttachments. With respect to your attachments, when you do add an attachment I recommend using FormData to create your XMLHttpRequest: // Example when adding an attachment var formData = new FormData(); formData.append("attachment",file);‍‍‍‍ // Example when updating an attachment formData.append("attachmentId", attachment.id);‍‍‍‍‍‍‍‍‍‍‍‍ You can see an example of working with attachments using the ArcGIS JavaScript API and the attachment widget here: SanFrancisco311 - Incidents Here's an example of the HTTP request when making an addAttachment. You can see this for yourself in the browser's developer tools under the network tab. ------WebKitFormBoundary1aQsyoAkAGZU7oKM Content-Disposition: form-data; name="attachment"; filename="Blue Lake.jpg" Content-Type: image/jpeg ------WebKitFormBoundary1aQsyoAkAGZU7oKM Content-Disposition: form-data; name="f" json ------WebKitFormBoundary1aQsyoAkAGZU7oKM--‍‍‍‍‍‍‍‍ If a request is successful you'll see a response in the network tab similar to this: { "addAttachmentResult" : { "objectId" : 7369, "globalId" : null, "success" : true } }‍‍‍‍‍‍‍ -Andy

‎04-11-2017

Logan, as Yue pointed out the quickstart-map-phonegap repo does have 4.x samples. You have to wait for Cordova's onDeviceReady to fire before loading the ArcGIS API for JavaScript.

‎03-28-2017

I recommend checking out the ArcGIS DevLabs: Get Started with ArcGIS DevLabs | ArcGIS for Developers. They are designed to help walk you thru how the pieces fit together starting at working with geographic Data, learning about cartographic Design and then pulling it all together in an application that you Develop.

‎03-28-2017

You might try loading jQuery before the ArcGIS API for JavaScript. Reference: quickstart-map-phonegap/jquery-gps.html at master · Esri/quickstart-map-phonegap · GitHub

‎10-31-2016

Josh, the name pattern in the URL determines whether or not anonymous will work with ArcGIS Online. Only the anonymous access approach allows both HTTP and HTTPS. Here are a few examples to hopefully illustrate the point a bit better. Example 1: this uses the ArcGIS Online organization's name in the URL and it will prompt you for a log in. There is no anonymous access using this pattern and it requires HTTPS: https://hack4co.maps.arcgis.com/home/webmap/viewer.html?webmap=06a23f2572014ebcbbbb1953688d2724 Example 2: this uses, HTTP plus www.arcgis.com in the URL and is open for anonymous access, no log in required: http://www.arcgis.com/home/webmap/viewer.html?webmap=06a23f2572014ebcbbbb1953688d2724 Example 3: switch out HTTP in Example 2 with HTTPS and this webmap still works for anonymous access, no log in required: https://www.arcgis.com/home/webmap/viewer.html?webmap=06a23f2572014ebcbbbb1953688d2724

‎10-27-2016

Hi Rachel, ArcGIS Online is already HTTPS-enabled. More details can be found here. Quoting from that article, here’s the relevant bits that I believe apply to your question: “If you've disabled anonymous access to your organization, you can share maps, apps, and groups by sharing the item with everyone (public) and changing the URL of the item from your organization's private URL to the public ArcGIS Online URL (www.arcgis.com). For example, you could share one of your organization's maps with anonymous users by changing the URL from https://samplegis.maps.arcgis.com/home/webmap/viewer.html?webmap=fb39737f95a74b009e94d2274d44fd55 to https://www.arcgis.com/home/webmap/viewer.html?webmap=fb39737f95a74b009e94d2274d44fd55.” Does that help?

‎10-10-2016

Firefox is looking into similar functionality. You can read the details here under Bug 1072859 – Disable Geolocation on non-secure origins Not sure about IE. And, I haven't seen anything from the Microsoft Edge team yet. The status of Geolocation in Microsoft Edge is Shipped - Microsoft Edge Development

‎09-28-2016

As of Safari 10, insecure geolocation is no longer allowed. Unfortunately, Safari 9.x didn't give any warning messages about the up coming change. The only place I had seen an official reference to this was in the Safari 10 Technology Preview Release Notes under Web APIs: "Started blocking Geolocation API calls on pages served over insecure connections". I'll make sure this info is passed onto the core JS API team. Additional references on StackOverflow: ios10 - Got an error when trying to get the geolocation in safari on iOS 10 - Stack Overflow

‎08-25-2016

Gotcha. Right, two other options are migrate to another browser or go to a hybrid approach. PhoneGap/Cordova uses plug-ins that can bypass the browser's Geolocation API, for example: cordova-plugin-advanced-geolocation.

‎08-25-2016

Hey Josh, sorry for the late reply. Not sure why, but I didn't get a notification of your post. Do you still have the problem or has it been resolved?

‎02-19-2016

New information update for Mac OS users as of Feb 2016. If you are testing a geolocation-based web app on Chrome locally you will have to use 'localhost' or '127.0.0.1'. Virtual hosts on Apache will result in the Geolocation API throwing the following error: " Only secure origins are allowed" and you won't be able to get a location.

‎02-18-2016

Mele, For now apps using the browser's Geolocation API will continue to work on Chrome with HTTP, but they will trigger a security indicator. At some point in the future that will change and geolocation-based apps will no longer work on HTTP. The best I can tell the Chromium team hasn't set a hard date, yet. You can read the implementation specifics in the latest working draft of the W3C Secure Contexts document. That's the document that applies to all browser vendors, not just Chrome. The web is moving in direction of making everything HTTPS, and it's a security best practice to use HTTPS whenever possible. If one map service is HTTPS-based then all services used by the app will have to be HTTPS, it's an all-or-nothing proposition.

‎10-21-2015

This is a significantly delayed answered. However for the benefit of everyone asking similar questions, the answer is 'yes' there are shops world-wide using the ArcGIS API for JavaScript with Cordova and PhoneGap. PhoneGap is Adobe's port of Apache's open source Cordova project and PhoneGap comes with extra bells and whistles such as a cloud-builder tool. Applications built using Cordova/PhoneGap are often referred to as Hybrid applications - that is JavaScript applications wrapped in a native container. These applications run on a chrome-less browser within the native runtime. It's quite possible that a popular consumer app that you use is built on a hybrid platform. Here are some reference materials: DevSummit Presentation - ArcGIS API for JavaScript: Building Native Apps using PhoneGap and JQuery Github project demonstrating how to use an ArcGIS JS API app within the PhoneGap/Cordova life-cycle - quickstart-map-phonegap API-based github project that provides a scaffolding for JS shops that have offline requirements - offline-editor-js Blog - What all mobile developers should know about PhoneGap Blog - Does PhoneGap improve geolocation?

‎10-21-2015

Seth, I'm not sure what the issue is, however if you have a geometry point you can always force the map to center on it using map.centerAt() or map.centerAndZoom().

Online Status	Offline
Date Last Visited	‎06-04-2026 08:11 AM

My Ideas

Latest Contributions by AndyGup

Getting started with Electron and the ArcGIS API for JavaScript

Re: How I can save a file into BLOB field?

Re: ArcGIS JavaScript Maps are not working in Android

Re: How to create feature layer using local json file in arcgis API for javascript 4?

Re: ArcGIS JavaScript API with jQuery: Error: multipleDefine

Re: Using a secure origin with browser-based Geolocation

Re: Using a secure origin with browser-based Geolocation

Re: Using a secure origin with browser-based Geolocation

Re: Using a secure origin with browser-based Geolocation

Re: Using a secure origin with browser-based Geolocation

Re: Using a secure origin with browser-based Geolocation

Re: Using a secure origin with browser-based Geolocation

Re: Using a secure origin with browser-based Geolocation

Re: Experience with the JS API and Cordova

Re: Inconsistent Map Centering After Geocode Result Returned

Re: Top Level Await and Imports in Safari (SDK 4.3...

Re: Route not displayed after update to chromium 1...

Re: Route not displayed after update to chromium 1...

Re: problem with deploying calcite to cloudflare

Re: ArcGIS Maps SDK for JavaScript – Version 4.33 ...