Sam Croft

Full-stack developer

How to ensure your Google maps marker icons are optimised for iPhone 4 retina display


Filed in: Google maps, iPhone 4, PhoneGap, retina display, Uncategorized


Due to Google’s constantly updating maps API there have been a number of issues with this technique (see comments). Currently, when using the latest API version (3.9 at time of this update) you must ensure your marker icon has the property optimized: false.

This is a little issue that I spent a couple of hours trying to fix one afternoon. I was using the Google maps v3 api in a web app and encountered a little annoyance when testing on an iPhone 4. My custom markers were [of course] looking absolutely horrendous on the retina display, as they didn’t have their own asset.

In native iPhone apps one can specify their own retina images using the @2x image suffix. In CSS it’s easy to use media queries to load an asset for iPhone 4’s and then use -webkit-background-size to specify the scaled dimensions.


Loading external data into a PhoneGap app using the jQuery JSONP plugin for cross-domain access


Filed in: jQuery, JSON, PhoneGap, Uncategorized

Important: view updated article – 9th July 2011

Following the release of jQuery 1.5 I have written a more up to date article and made available all of the source code and sample app.

View the updated article

Continuing my love affair with PhoneGap I thought I’d share a few methods of handling external data that I’ve adopted, tweaked and re-written for use in my web app escapades at RITH.

PhoneGap doesn’t ship with a data layer but as web apps [commonly] utilise a JavaScript library, this isn’t an issue. I use jQuery, but it is worth noting there are several other more compact JS libraries that may be more suitable if you want to keep your app as lightweight as possible.

This isn’t solely related to PhoneGap apps – this technique can be used in any web app, but it’s immensely useful within PhoneGap.