Leveraging data-as-a-service with the ArcGIS JavaScript API

Welcome to the information age! We are part of a lucky generation to be living in a time of great technological change. All around us, data and information about the world is being collected and collated, just waiting for someone to take advantage of it. Based on a recent demonstration we provided to a group of enthusiastic startups, this blog post looks at how to pull in some publicly available data via web services into a basic ArcGIS web app. We are going to use the Public transport data for emerging cities from wheresmytransport through a simple Restful web service.

We will build a basic web (but mobile-ready) app that locates the user and identifies the 10 nearest public transport stops and shows them on a map.

So, where do we begin? With the map of course!

1. Create a web app stub

Open a new project/page in your favourite web development IDE (I still just use notepad++) and create a basic framework for an app. We will pull in the ArcGIS JSAPI and related CSS, a simple HTML structure with some associated CSS classes for controlling how the app will look.

You wont see much when opening this, but here is a tip for how I view and debug my “mobile-ready” apps – open Chrome Developer tools (F12) and toggle the device toolbar. Dock the dev tools window to the right and choose an appropriate mobile device from the drop-down. You can now easily view your app and follow the console alongside.

2. Add a map control

Using the JSAPI that has been loaded, follow the basic steps for creating a WebMap from an ArcGIS Online web map ID, add it to a MapView and assign it to the dom node you just created called “map”. Place the following code inside a script tag in the document header.

If you are using the Chrome Developer tip I mentioned, you should see something like this.
Web App - Step 2

3. Add “find me” button
HTML5 provides a handy geolocation API for getting the user’s location based on the best available method on the device. Esri has packaged this method into a simple widget that makes it easy to add to a map. Note that in v4.x of the JSAPI you can now add items to the “ui” of the map using the “view.ui” properties. To add the widget, insert the following code into the main function that will load the widget, add it to the UI and set up a handler that zooms and centres the map to your coordinates.

TIP: don’t forget to add the new requires: “esri/widgets/Locate”,”esri/layers/GraphicsLayer”

And, then call the new function once the map has loaded (i.e. within the “view.then(function(){“ function).

Your output should look a little like this after clicking the new button:
Web App - Step 3

4. Get stops from wheresmytransport
First, I recommend going to check out wheresmytransport.com and read up on their cool data service that provides real-time access to consolidated public transport information in many major global cities (including Joburg and Cape Town). Use of their API is free if you sign up as a developer here: https://developer.whereismytransport.com/ – you will need to do this to get a client id and secret to run the app.
Now, we will add a new button that will call the service by adding the following code into your main function:

And add a dom node to host the new button to the HTML body:

Now that we have a button, let’s listen for it’s click event and then call the wheresmytransport service – by adding this code to the main function:

Now, before you can use the wheresmytransport service, you need to request a security token. Add this code into the function you just created.

You will notice that the successful callback runs a new function called “getStops(token)” to which it passes that new token. The getStops function looks like this.

This code only sends the request, now we need to handle the response by adding “then” and “catch” callbacks for the promise variable we created called “getLocalStops”. This code will process the results by creating a new Esri graphic and adding to the graphics layer with the specified symbology.

TIP: Remember to add the new requires “esri/symbols/SimpleMarkerSymbol”, “esri/Graphic” and “esri/geometry/Point”

Finally, for the eagle-eyed among you, there is a utility function called from within the code called “getWMTdata” that takes the url, token and payload which you can use generically for calls to those services.

That’s it. Run the app and after clicking both the “Locate Me” and the “Get Stops” button, your app should look a little like this:
Web App - Step 4

5. Take it further…
This is a basic example, but think about how you can take this app further, by adding capabilities such as:

  • Finding the nearest stop based on travel distance/time using the FindNearest method from ArcGIS
  • Display results back to the user in a table or list for easy viewing
  • Log requests made by users to be able to assess where the demand for the app is…
  • Many many more!!

If you would like to try out the sample code, you can download this example here. Let me know in the comments below if you want some more info/help!

Happy app-making

– Richard

Demystifying Web GIS

what is webgis

GIS is evolving. That is a fact, but equally true is how quickly this is happening. Sometimes just keeping up with it all seems overwhelming. So how can we simplify some of these new concepts such as “Web GIS” and the “Web AppBuilder”? And once you know the potential of modern Web GIS, how can you be successful in leveraging that within your organisation? Esri South Africa hosted a seminar on 28 July to unpack these topics and show some examples of how Portal for ArcGIS can be used and configured to suit the way your company operates.

In summary, Web GIS is very much the GIS we already know and love. It is now just much more accessible using web technologies and is greatly simplified/configurable to suit the wider audience it now caters to. Look through a copy of the presentation from the seminar to get an idea of what was discussed and feel free to leave a note, comment, thought or problem in the comments below.

Demysitfying Web GIS – Esri South Africa Seminar – July 28

Happy web gis’ing!

– Richard

Make your own 3D web app

jsapiWe all know that ArcGIS comes with a very large number of out of the box apps that seemingly do just about everything! Surprisingly though, we often come across the problem of finding an app that “fits just right” with what you need to achieve. The solution to this is to build your own app using an API or Runtime. The beauty of the ArcGIS APIs and Runtimes is that they extend the platform – meaning you can leverage all the power of ArcGIS such as Server, map services, web maps, popups, geoprocessing, etc all in a front-end that suits your workflow, user needs and styling choices. This may seem daunting, but don’t be fooled, anyone can do it!

This post will take you through some basic steps to create your own custom web application using a 3D scene. We will use the ArcGIS JavaScript API 4.0 to make the app.

1. Getting started – setting up your environment

Like I said, this is really simple. There are only two things you need. Firstly, you will need an ArcGIS Online subscription to make a web scene that we will load into our custom app

Secondly, you will need is a JavaScript IDE (editor) such as Notepad++ or WebStorm (link).

And that’s it, we are ready to go!

2. Creating the web scene

Log in to your ArcGIS Online account and click the menu option entitled “Scene”. This is a familiar interface very similar to the “Map” tool that lets you other webmaps. Use this tool to create a web scene with your own data layers, popups and symbology. In my example, I have added the provinces of South Africa as a layer and extruded them to show some 3D.

Creating a web scene in ArcGIS Online

Make sure to save the scene when you are done and take note (copy into notepad) of the item id for the web scene. You can grab this from the address bar in your browser. My id is “0390e2ec01fa488a847d4e413f015cd0”.

Getting the web scene’s ID

Note that to make things easier, you can share your web scene publically. This will avoid your app needing to authenticate you when opening it (i.e. logging in). In future, you can add security to your app as required.

More info on how to create a web scene, go to this link.

3. Creating your web page structure

Open up a new, empty html file in your IDE of choice. We will first put in the basic structure of the HTML page to get us going (TIP: I have created myself a template that I can re-use as a starting point each time I want to create a new app – saving me the time of creating the structure). An HTML page consists of some mandatory sections:

  • HTML doctype declaration – so that a web browser knows that the page is an HTML file (and what version – we are using 5)
  • Head – this includes all necessary ‘meatadata’ for the web page including the styling and logic (javascript)
    • Title – be sure to set a readbale title that you will see on your browser tab
    • CSS – this is the styling file and its easiest to pull in the CDN hosted Esri stylesheet
    • Javascript libraries – this is the ‘core’ JS library that will enable all kinds of web mapping goodness, we will pull in the CDN hosted JSAPI from Esri (link)
    • Javascript – this is the logic of your won app, here will enter our code to load a scene view and any other logic we want from the page
  • Body – this is the HTML which provides the structure of the page using HTML tags (link)

Here is my basic skeleton template including the links to the CDN CSS and JavaScript libraries that make up the ArcGIS JavaScript API (v4.0):

<!DOCTYPE html>

<title>My First 3D Web App</title>

<link rel="stylesheet" href="https://js.arcgis.com/4.0/esri/css/main.css">
<script src="https://js.arcgis.com/4.0/"></script>

/* section for my custom code */


<!-- page layout will go here --> 


More info on creating HTML pages, go to this link.

4. Building the HTML page structure

Before we can add a map (or other elements) to the UI, we need to create the structure of the page itself. Now, there are many ways to skin this cat which I wont go into in this post, but I am going to use a couple of layers (“DIV”s in HTML parlance) to layout my page. This is where you can really start to have fun – since you are in full control of everything, you can choose layout, colours, fonts, graphics, etc to make you page look great!

Here is the HTML layout code that is inserted into the “body” section:

<div id="wrapper" style="position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: rgb(200,200,200)">

  <div id="mapPanel" style="position: relative; float: left; width: 60%; height: 100%">

  <div id="mapDescription" style="position: relative; float: left; width: 40%; height: 100%; background-color: rgb(220,220,220)">
    <p style="margin: 10px; font: normal 10pt verdana;">Welcome to my very first 3D web app! You can click around and navigate the scene.</p>


5. Adding the JavaScript “Scene View”

Since v4.0 of the ArcGIS JavaScript API, Esri now uses a new pattern for adding maps to the view. This is done by first creating the map (which is a container) and then adding a view to that map.

Here is the code for loading my map which is inserted directly into the <script> section:

], function(SceneView, WebScene) {

  var scene = new WebScene({
    portalItem: {
      id: "0390e2ec01fa488a847d4e413f015cd0" // replace with your web scene's ID

  var view = new SceneView({
    container: "mapPanel",
    map: scene


Note that I have entered the Item ID from the web scene I created earlier as the reference. This means that the logic will now create a scene container, find the scene item by its id and load that into the scene as a view. Too easy!

More info on the ArcGIS JavaScript API, go to this link.

6. Revel in your mastery

And that’s it! You have created your first 3D web app. To view it, simply open the HTML page in your favourite browser (JSAPI v4.0 is supported in Chrome, Firefox, and IE 11).

Here is a screenshot of my first app:

My First 3D Web App!

Happy coding!

– Richard

Moving and shaking the mining industry

Esri MUGAnyone who believes that Mining, as an industry and technology consumer, is standing by and doing nothing while it struggles through a major downturn, surely did not attend the Esri Mining User Group (MUG) meeting, recently held at the University of Pretoria’s Virtual Reality Centre for Mine Design (link).

Although it is true that the impacts of new ideas and new technologies may not yet have resuscitated the status quo, there is certainly hope, perhaps due to the current economic climate, that these changes to our thinking and doing within operational mining will bring about true business disruption for the greater good.

The advent of true integrating technologies such as ArcGIS as well as other powerful process, analytical and visualisation tools is showing that things need not be what they have always been.

Providing an industry-wide glimpse of new capabilities, Esri partners spoke about some promising new developments including direct geospatial enablement of governance and risk systems (Isometrix), geotechnical integration and analysis with slope monitoring systems (Aciel Geomatics), the blurring of OT and IT systems (OSIsoft) and the new business outlook for Spatial Dimension (Trimble).

Certainly a highlight of the day was the use of the Virtual Reality Centre’s demo theatre; a 360-degree immersive VR cylinder that showcased some initial R&D underway with key partners, looking at how VR can enhance mine planning, production analysis, above-to-underground visualisation and other high value 3D questions in a truly immersive environment. Breaking down barriers of understanding to achieve better decisions and outcomes is the ultimate goal… Watch this space!

But the day was ultimately focussed on our users.

Esri MUG 2

Miranda Muller from AngloGold Ashanti gave some inspiring insights into how to pilot new technologies in an industry that is typically averse to trying cutting-edge tech including drones, IoT and VR.

Theodor Paetzold spoke about how Rio Tinto is trying to resurrect its global user groups that assist in creating a global GIS community for better support and collaboration.

Pieter Mostert at Anglo American gave some create insight into how GIS technology has been used to improve the business of mineral exploration and the entire mining value chain –by creating a single integrated source of the truth for people to access anywhere around the globe.

Finally, Professor Fred Cawood of the University of Witwatersrand rounded things off seriously by addressing some of the pressing questions and ideas needed for moving the mining industry forward in a decline against the backdrop of our socio-political climate.

Carl Bester, from Esri South Africa, gave a ‘mid-term’ update of ArcGIS for Mining and how it has been received by our current users since it has evolved over the past few years. He also provided some insight for new and emerging users on the possibilities of creating an interconnected geospatial platform within a mining operation to deliver the right information, at the right time, in the right way to the people who need it.

It is an exciting space that is ever expanding, leveraging the new tools and capabilities of ArcGIS, and contributing to the changing face of information and data in the mining industry.

All these talks provided some thought provoking concepts that showed how, by embracing digital technology, we can revive and ultimately disrupt the mining industry. The focus is on us, the technologists, to be the agents of change within our organisations to push through new developments that have been proven to be beneficial to the industry.

The Esri MUG is a collaborative forum that aims to bring users with common challenges and experiences together to learn and share ideas. The meeting at Tuks was just one such initiative and we welcome further ideas on how to improve this teamwork approach. Esri South Africa will be hosting more MUG events in future, do join us next time.

Please drop us a line if you would like to know more about the discussions and presentations offered on the day.

– Richard

Modelling Reality in 3D with ArcGIS – Blog Series

modelling reality - logo

Welcome to 2016! This is going to be a bumper year on the Esri South Africa blog so be sure to keep checking back for new content (or you can subscribe using by clicking the FOLLOW US button on the right).

Following our successful demonstration of CCTV camera placement at the Africa User Conference, we are pleased to introduce a new blogging series that will showcase some new and innovative ideas for leveraging the power of 3D modelling and analysis within the ArcGIS Platform. The entries will be created by our team of 3D experts here at Esri South Africa and will include step by step guides on how to do it yourself.

If you have any specific requests for 3D modelling or analysis scenarios, please drop us a line using the comments below.

The first entry in the series, entitled “Determining Solar Potential for Rooftops using Multipatch Feature Types”, will be available next week!

– Richard

Esri AUC 2015 – the highlights package!

blog auc

The very first Esri Africa User Conference has shut its doors. And what an incredible experience it was for us all! It’s not every day in Africa that you can walk around with over 900 people that actually know about GIS 🙂 I think the best way to sum up the success of the conference is to look at how our colleagues from Esri Inc were taken aback by the enthusiasm, participation and general level of interest in the technology and the science of GIS. Well done to all those who participated and for all the hard work that the organisers put into the event. I have asked my colleagues to help me put together our Top 7 observations from the conference.

1. Education

This was so popular that we had to turn people away from the dedicated Education track due to lack of space! A number of people I spoke to singled out Michael Goodchild’s keynote about GIS as a science as one of the most interesting talks of the week – what an honour it was to see the ‘informal chat’ he had with Mr Dangermond and Michael Gould of Esri. And there was also significant interest at the Education stand in the Expo centre that was promoting the Funda Lula initiative as well the new upcoming Diploma in Geographical Information Science and Technology (GISc & T).

2. App speed dating

Having been an extremely popular item at the User Conference in San Diego this year, Esri South Africa decided to show of our own talents with a uniquely African twist. All for a serious purpose too – understanding the (very wide) range of apps that run on the ArcGIS Platform and what they are geared to do. The video will certainly be played out in our own offices a few times in the years to come! Well done to the ‘apps’ for putting on a great show.

3. Sandbox and 3D printer

People are always interested in toys… While the software demo stands were busy throughout the Expo, it was the educational sandbox and 3D printer that were drawing the most unexpected crowds. If you missed it, the Sandbox is an interactive teaching tool that dynamically projects a contour map onto a box full of sand as you move it around. I saw some new and interesting types of topography being sculpted in there all week! The 3D printer was used for many fun things, but also showing how to turn an abstract map of something like a volcano, into a real, tangible object that you can interact with… Very exciting what we will be doing with this technology in the next few years.

4. Imagery

A sometimes overlooked strength of the ArcGIS Platform is working with imagery. Lots of imagery. Some exciting topics that were covered by Peter Bekker in the Plenary that looked at how you can quickly (!) and easily access petabytes of Landsat data from your basic web browser. You can dynamically adjust the data to show change over time or calculate an NDVI. For more information, have a look at Esri Imagery Services.

5. Free the data

A common area of discussion we had with a number of the delegates was our old friend “data”. Something that came up a few times is how can they engage the public to provide more data – that is, allow the public or clients become active participants in the processes of government and private sector service providers. This is commonly referred to as crowd-sourcing and there are a number of ways of enabling this through the rich apps provided by the ArcGIS Platform (e.g. Survey1-2-3, Collector, etc.). But remember that the tools are only the final piece of the puzzle – first you need to design how this will fit in with your current business processes, who will be the owner of the data, how will it be managed, etc.

The flip side of this coin, is that organisations holding data want to be able to share it more effectively – both with each other – and back to the public. This certainly means that the ArcGIS Open Data initiative is something that will be growing rapidly on Africa in the coming years. For more info, go to ArcGIS Open Data.

6. People!

The final item on our list was… You! I have never seen a closing session quite so full before – this showed to me that everyone (despite their best efforts at the party on Thursday) was keen to squeeze every last drop they could out of the conference. All the technical workshops and training sessions were full; all the paper presentations I went to were very well attended. It was also great to have a good representation from our friends and colleagues in other parts of Africa – I enjoyed some talks about natural resource management in central Africa – and even managed to introduce two experts that are working on the same topic in the same region!

7. Doing it all over again?

Finally, Mr. Dangermond did a pretty good job in helping us decide whether we would be doing this again. Based on some pretty enthusiastic responses from the crowd at the closing plenary, it looks very likely that we will do this all again in 2 years’ time – but nothing is confirmed just yet! The crowd ‘noise-o-meter’ was a little more difficult to read when Jack asked where it should be hosted… but seemed like Cape Town edged it to me? Or was it Durban?

Also, for those of you who would like to review any of the presentations or watch videos of the plenary sessions, they will be made available soon – check back here for details!

– Richard

CTICC Welcomes Esri AUC!

esri auc at cticcOur team has touched down in the Mother City to put the final touches together for the first ever Esri Africa User Conference! There are over 900 people expected to rain down on the Cape Town International Conference Centre this week, coming to hear inspirational talks from industry thought leaders like Jack Dangermond, Michael Goodchild and Jacqueline McGlade. If you are lucky enough to be joining your fellow geo-geeks, we look forward to seeing you in beautiful Cape Town. For those of you that were unable to join, please check back here for a post conference wrap-up of the major technology highlights and talking points.

Happy networking!

– Richard

Running a Data Interopability ETL tool in a python script

32bit versus 64bit
32bit versus 64bit

The Data Interoperability Extension for ArcGIS is an incredibly powerful tool for migrating and transforming data (both spatial AND non-spatial). We have been using it a lot lately with our clients to assist in creating an integrated platform for them where they can view all their geospatial data in a single, authoritative portal, regardless of where it comes from. The problem always is that the moment you run an ETL tool, the data is out of date. So, to solve this, we wrap our ETL tools in python and schedule them as Windows Tasks to run periodically and automatically. When I first did this, I got some strange error back from my python interpreter saying that the tool could not be executed (obviously, no more detail than that!).

The key thing I found and is critical to understand, is that Data Interop (at least up until v10.3.1) is a native 32bit Windows application. When you install ArcGIS for Desktop it automatically installs both the 32bit and 64bit version of python – the default (set in your environment variables) will be the 64bit one. Logically, you cannot execute a 32bit process from within a 64bit one… Hence the error.

So, once you know this, the workaround is simple! Just execute your python script using the 32bit python.exe and voila, your ETL will run inside the python and can now be scheduled using Windows tasks.

Happy scripting!


6 things you can do with ArcGIS in 60 minutes or less


The ArcGIS product stack can sometimes be overwhelming. Quite often I get asked if we “can do something” – before I even hear the “thing” my answer is yes! The challenge is always how to do it and with which set of tools. So, with all this amazing technology, we sometimes forget how easy it is to do the basic things – getting data into the system and sharing it in powerful and meaningful ways. So here is my list of 6 things you can do in a very short amount of time with ArcGIS, do you have any other ideas?


Make your own field data app

Want to capture pictures and the location of graffiti in your neighbourhood? The location and a photo of birds on a walk in the bush? Just open an editable web map on Collector for ArcGIS (iOS and Android) and start capturing! More info here.

2Create a website that tells a story with maps

Want to show your friends all the places you have visited this year? Or maybe want to show off sights of your neighbourhood in your local community meetings? Use a web map and create a story map using a template and your data and share! More info here.


Configure a mobile-ready web app

You want to be able to create a native mobile app for your children’s school to use on their outings? Or to brand an information app for your cousin’s tour company? Use a web map and configure the app with the AppStudio for ArcGIS! More info here.

4Deploy an app to any mobile platform

Want to create a basic mapping app that allows people to click on a feature and get a popup? Or change the basemap to imagery and view their own house using their mobile phone? Use a web map and configure a web app using the Web AppBuilder for ArcGIS! More info here.

5Add your Excel data to a map

Have some Excel data about schools in your province and want to add them to a map? Or maybe you have some Excel information about households in your local club and want to add them to a map? Use Excel with Esri Maps for Office and you can quickly add that data to the map using a wizard! More info here.

6Embed a map into your existing website

Have an existing website and want to include a map with directions to your office or house? Use a web map and embed it using code provided for you! More info here.

Welcome to the new Esri South Africa Blog!

Welcome to the Esri South Africa blog.
Welcome to the Esri South Africa blog

I am happy to announce that we are officially launching the new home of the Esri South Africa blog! This site is intended to provide some practical and useful information to our current Esri users and business partners as well as to the wider community. Keep coming back to see what’s new – we are striving to continually add content that addresses the practical side of the ArcGIS technology, from lessons learnt through our own experience in working with the products.

Please feel free to leave comments, queries, and suggestions in the feedback boxes and I encourage you to collaborate with the blog poster – typically, this will be the best person to ask questions about that particular topic.

The blog is also intended to let you get to know the staff at Esri South Africa. We are a diverse bunch of technical (and sometimes crazy!) people and all somehow ended up having a passion for GIS and technology.

Happy reading!

– Richard