Archive for the ‘ArcGIS JavaScript API’ Category

iPad and Motorola Xoom – a tale of two browsers

Tuesday, April 26th, 2011

We recently built a web application (several actually) that we needed to work well on tablets. Since the first Android 3.0 (Honeycomb) tablet, the Motorola Xoom, is now out (and since I have one) we were specifically targeting the iPad and the Xoom. Though they both use Webkit based browsers, I ran into a couple of interesting differences between the two.

First off, I used -webkit-user-select:none; to prevent selection of various elements in the ui. This worked flawlessly in Mobile Safari on the iPad but Chrome on Android does not seem to respect it at all.

I also ran into a couple of issues using the ArcGIS Javascript API on the Xoom. Since Android doesn’t support SVG, the JSAPI uses canvas and there are evidently some small problems with their canvas implementation. TextSymbol doesn’t work and neither do any of the fill styles for simple fill symbol except solid and null. Overall the JSAPI works great on the Xoom, though.

I’m told that the text symbol issue will probably be fixed in the 2.3 release.

Blueprint CSS and the ArcGIS Javascript API

Monday, April 25th, 2011

This is one of those things that I’m posting so that I can remember it in the future, but maybe it will help somebody else too.

Blueprint is a css framework I sometimes use. It’s easy to understand and use. But I’ve noticed that it stomps on some ArcGIS Javascript API styles and messes up the zoom slider. Also, don’t forget to assign the appropriate class to the body or some appropriate element so the JSAPI styles get applied!

Specifically, some of the table related styles in Blueprint’s screen.css file are to blame. Generally, I just get rid of all of them but it you want to get surgical about it, the following are the offending declarations:

table {margin-bottom:1.4em;width:100%;}

and

tbody tr:nth-child(even) td, tbody tr.even td {background:#e5ecf9;}

Google Maps Extender for the JS API and SSL

Friday, April 9th, 2010

I recently needed to enable SSL on an ArcGIS Server map service that I was consuming with the Google Maps Extender for the Javascript API. This was not as straightforward as I expected so I thought I’d post about some of the pitfalls that I ran into. Note that I did this on the ArcGIS Server 10 pre-release but previous versions should be similar. I’ll do this in the form of a checklist and I’m just gonna hit the high points. Lots more information can be found at the links provided or you can post a comment and I can elaborate:

  1. Before you do anything, change the ‘Clear Cache Options’ for ArcGIS Server to periodic and set the interval to something very short like 1 minute. That way you won’t have to remember to clear the cache every time you make a change. Don’t forget to change this setting to something more reasonable when you’re all done.
  2. For this project I was planning to implement token based security too and was just gonna take it one step at a time so I would know why stuff broke when it inevitable did. So the first step was to implement ESRI’s proxy page. The instructions here are very good.
  3. Then you’ll want to configure the Google Maps Extender to use the proxy. You do that with javascript like this:
        esri.arcgis.gmaps.Config.proxyUrl = 'proxy.ashx';
        esri.arcgis.gmaps.Config.alwaysUseProxy = true;
  4. Here’s where I ran into my first problem. My dynamic map service layer wasn’t coming through. I fired up Firebug and saw the problem: esri.arcgis.gmaps.DynamicMapServiceLayer do an export map request then they do a ‘Get’ for the map image using the url returned from the export map request. The url for the map image pointed to the arcgisoutput directory which was not configured in my proxy. There are a couple of ways you could fix this problem but I hit it with a hammer: I just configured the proxy to proxy all requests to that hostname. And it worked!
  5. Get an SSL certificate for your ArcGIS Server. ESRI’s instructions here were helpful. I used a self signed certificate since this is for development/ testing.
  6. Next you need to setup your map service to require ssl. You do this in ArcCatalog at the folder level. So open ArcCatalog, connect to the server, right click on the folder that contains your map service, select ‘Properties’, check the ‘Require Encrypted Access’ box, and click ‘OK’.
  7. Now you can change the url’s in your proxy config and your javascript to point to the https url.
  8. Here’s where I ran into problems. The webserver where the proxy was running was not accepting the certificate of the ArcGIS Server. I know what to do, I thought, so I tried to hit the page in IE from the webserver and, as expected, got a message saying the certificate wasn’t trusted. So I went to the page anyway then viewed the certificate. Then I installed the certificate. But when I ran the app again, the certificate was still refused. Finally, I found this post which pointed out that I had just installed the certificate for the logged on user. Follow the link for instructions on how to install it for the local machine.
  9. But then it still didn’t work. So I fired up Firebug and saw what was happening: Remember above where I talked about how Dynamic Map Service Layers work? Well what was happening now was that the output directory url that was being returned by the export map request wasn’t an ssl url so since my proxy was only configured with the https url, it wouldn’t proxy the map image requests. I didn’t find any documentation on this (I didn’t look very hard) but I fixed it by adding another output directory just for ssl and configuring my map service to use it. You do this in ArcCatalog: Right click on your connection to the ArcGIS Server, click ‘Server Properties’, and go to the ‘Directories’ tab. Select ‘Output Directory’ from the ‘Directory Type’ list and then click add. Now give it the path to the directory you want to use (I created an arcgisoutputssl directory right next to the arcgisoutput one) and give it a virtual directory(I used https://<hostname>/arcgisoutputssl) and click ‘OK’ and ‘OK’.
  10. Now at this point you might be thinking that you’re done as I was. But it still didn’t work. I was getting 404′s from the map image requests. I assumed since the AGS post install creates those virtual directories that when I added an output directory it would create its virtual directory for me. But it doesn’t, so go ahead and create your virtual directory and don’t forget to set it to require ssl.

That’s it! Hope this helps somebody.