Chapter 14 — Merging with Flickr Photos 287
</img>
</a>
</td>
</tr>
</table>
It is probably difficult to determine from the preceding XSL, but to select a specific size and
format of image from the Flickr server, you have to construct a URL based on the photo ID,
server ID, secret key, and required format. For example, to pull out a tiny thumbnail, in the
shape and size of a 75x75 pixel square, you use the following image URL:
http://static.flickr.com/{server-id}/{id}_{secret}_s.jpg
The sat the end of the URL specifies the 75x75 pixel square. Other available sizes include a
100-pixel thumbnail (letter t), a small image (240 pixels on the longest side, letter m), a large
image (1024 pixels on the longest side, letter b), and a medium image (no letter).
Parsing Photo Data
To pick out the information required, the XML original must be parsed for the data you need.
From the perspective of the Google Maps application, only the tag data actually needs to be
extracted. The rest of the XML processing takes place as part of the XSL Transformation.
Extracting the tag data is made a little more complex by the textual nature of the latitude or
longitude being embedded into the tag string.
The process starts with a simple request and the extraction of a list of tags from the response
XML:
function getphotoinfo(index)
{
var request = new XMLHttpRequest();
request.open(‘GET’,
‘/examples/ch14-02flickrproxy.pl?method= ;
flickr.photos.getInfo&api_key=’ +
‘XXX’ + ‘&photo_id=’ + photoids[index], true);
request.onreadystatechange = function() {
if (request.readyState == 4) {
var xmlsource = request.responseXML;
var tags = xmlsource.documentElement.getElementsByTagName(“tag”);
The tags are then individually processed to identify the information. Each tag must be checked
to see if it contains the data required:
for(i=0;i<tags.length;i++) {
var lat;
var lng;