Skip to content

Commit 801b32a

Browse files
author
Éric Lemoine
committed
Merge pull request openlayers#345 from elemoine/flickr
timed out on "examples/strategy-cluster.html"
2 parents 032293c + 9a9a5ba commit 801b32a

File tree

3 files changed

+161
-69
lines changed

3 files changed

+161
-69
lines changed

examples/strategy-bbox.html

Lines changed: 59 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -10,53 +10,83 @@
1010
<script src="../lib/OpenLayers.js"></script>
1111
<script type="text/javascript">
1212
var map, photos;
13-
OpenLayers.ProxyHost = (window.location.host == "localhost") ?
14-
"/cgi-bin/proxy.cgi?url=" : "proxy.cgi?url=";
15-
13+
14+
/**
15+
* A specific format for parsing Flickr API JSON responses.
16+
*/
17+
OpenLayers.Format.Flickr = OpenLayers.Class(OpenLayers.Format, {
18+
read: function(obj) {
19+
if(obj.stat === 'fail') {
20+
throw new Error(
21+
['Flickr failure response (',
22+
obj.code,
23+
'): ',
24+
obj.message].join(''));
25+
}
26+
if(!obj || !obj.photos ||
27+
!OpenLayers.Util.isArray(obj.photos.photo)) {
28+
throw new Error(
29+
'Unexpected Flickr response');
30+
}
31+
var photos = obj.photos.photo, photo,
32+
x, y, point,
33+
feature, features = [];
34+
for(var i=0,l=photos.length; i<l; i++) {
35+
photo = photos[i];
36+
x = photo.longitude;
37+
y = photo.latitude;
38+
point = new OpenLayers.Geometry.Point(x, y);
39+
feature = new OpenLayers.Feature.Vector(point, {
40+
title: photo.title,
41+
img_url: photo.url_s
42+
});
43+
features.push(feature);
44+
}
45+
return features;
46+
}
47+
});
48+
1649
function init() {
17-
map = new OpenLayers.Map('map', {
18-
restrictedExtent: new OpenLayers.Bounds(-180, -90, 180, 90)
19-
});
20-
var base = new OpenLayers.Layer.WMS("Imagery",
21-
["http://t1.hypercube.telascience.org/tiles?",
22-
"http://t2.hypercube.telascience.org/tiles?",
23-
"http://t3.hypercube.telascience.org/tiles?",
24-
"http://t4.hypercube.telascience.org/tiles?"],
25-
{layers: 'landsat7'}
26-
);
50+
map = new OpenLayers.Map('map');
51+
52+
var base = new OpenLayers.Layer.OSM();
2753

2854
var style = new OpenLayers.Style({
2955
externalGraphic: "${img_url}",
3056
pointRadius: 30
3157
});
3258

3359
photos = new OpenLayers.Layer.Vector("Photos", {
34-
strategies: [new OpenLayers.Strategy.BBOX()],
35-
protocol: new OpenLayers.Protocol.HTTP({
36-
url: "http://labs.metacarta.com/flickrbrowse/flickr.py/flickr",
60+
projection: "EPSG:4326",
61+
strategies: [new OpenLayers.Strategy.BBOX({resFactor: 1})],
62+
protocol: new OpenLayers.Protocol.Script({
63+
url: "http://api.flickr.com/services/rest",
3764
params: {
38-
format: "WFS",
39-
sort: "interestingness-desc",
40-
service: "WFS",
41-
request: "GetFeatures",
42-
srs: "EPSG:4326",
43-
maxfeatures: 10
65+
api_key: 'b5e8c0e287e678671c3d8b2c0f3ced85',
66+
format: 'json',
67+
method: 'flickr.photos.search',
68+
extras: 'geo,url_s',
69+
per_page: 10,
70+
page: 1
4471
},
45-
format: new OpenLayers.Format.GML()
72+
callbackKey: 'jsoncallback',
73+
format: new OpenLayers.Format.Flickr()
4674
}),
4775
styleMap: new OpenLayers.StyleMap(style)
4876
});
4977

5078
map.addLayers([base, photos]);
51-
map.setCenter(new OpenLayers.LonLat(-116.45, 35.42), 5);
79+
map.setCenter(
80+
new OpenLayers.LonLat(-567468.5392481,
81+
4950672.5471436), 5);
5282
}
5383

5484
</script>
5585
</head>
5686
<body onload="init()">
5787
<h1 id="title">BBOX Strategy Example</h1>
5888
<div id="tags">
59-
vector, feature, stylemap, wfs, bbox, strategy, cleanup
89+
vector, feature, stylemap, bbox, strategy, script, flickr
6090
</div>
6191
<p id="shortdesc">
6292
Uses a BBOX strategy to request features within a bounding box.
@@ -67,6 +97,10 @@ <h1 id="title">BBOX Strategy Example</h1>
6797
previously requested data bounds are invalidated (by browsing to
6898
some area not covered by those bounds), another request for data
6999
is issued.</p>
100+
101+
<p>This particular example uses the <a
102+
href="http://www.flickr.com/services/api/">Flickr API.</a></p>
103+
70104
</div>
71105
</body>
72106
</html>

examples/strategy-cluster.html

Lines changed: 51 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -70,20 +70,45 @@
7070
<script src="animator.js"></script>
7171
<script type="text/javascript">
7272
var map, template;
73-
OpenLayers.ProxyHost = (window.location.host == "localhost") ?
74-
"/cgi-bin/proxy.cgi?url=" : "proxy.cgi?url=";
73+
74+
/**
75+
* A specific format for parsing Flickr API JSON responses.
76+
*/
77+
OpenLayers.Format.Flickr = OpenLayers.Class(OpenLayers.Format, {
78+
read: function(obj) {
79+
if(obj.stat === 'fail') {
80+
throw new Error(
81+
['Flickr failure response (',
82+
obj.code,
83+
'): ',
84+
obj.message].join(''));
85+
}
86+
if(!obj || !obj.photos ||
87+
!OpenLayers.Util.isArray(obj.photos.photo)) {
88+
throw new Error(
89+
'Unexpected Flickr response');
90+
}
91+
var photos = obj.photos.photo, photo,
92+
x, y, point,
93+
feature, features = [];
94+
for(var i=0,l=photos.length; i<l; i++) {
95+
photo = photos[i];
96+
x = photo.longitude;
97+
y = photo.latitude;
98+
point = new OpenLayers.Geometry.Point(x, y);
99+
feature = new OpenLayers.Feature.Vector(point, {
100+
title: photo.title,
101+
img_url: photo.url_s
102+
});
103+
features.push(feature);
104+
}
105+
return features;
106+
}
107+
});
75108

76109
function init() {
77-
map = new OpenLayers.Map('map', {
78-
restrictedExtent: new OpenLayers.Bounds(-180, -90, 180, 90)
79-
});
80-
var base = new OpenLayers.Layer.WMS("Imagery",
81-
["http://t1.hypercube.telascience.org/tiles?",
82-
"http://t2.hypercube.telascience.org/tiles?",
83-
"http://t3.hypercube.telascience.org/tiles?",
84-
"http://t4.hypercube.telascience.org/tiles?"],
85-
{layers: 'landsat7'}
86-
);
110+
map = new OpenLayers.Map('map');
111+
var base = new OpenLayers.Layer.OSM();
87112

88113
var style = new OpenLayers.Style({
89114
pointRadius: "${radius}",
@@ -101,22 +126,24 @@
101126
});
102127

103128
var photos = new OpenLayers.Layer.Vector("Photos", {
129+
projection: "EPSG:4326",
104130
strategies: [
105131
new OpenLayers.Strategy.Fixed(),
106132
new OpenLayers.Strategy.Cluster()
107133
],
108-
protocol: new OpenLayers.Protocol.HTTP({
109-
url: "http://labs.metacarta.com/flickrbrowse/flickr.py/flickr",
134+
protocol: new OpenLayers.Protocol.Script({
135+
url: "http://api.flickr.com/services/rest",
110136
params: {
111-
format: "WFS",
112-
sort: "interestingness-desc",
113-
service: "WFS",
114-
request: "GetFeatures",
115-
srs: "EPSG:4326",
116-
maxfeatures: 150,
137+
api_key: 'b5e8c0e287e678671c3d8b2c0f3ced85',
138+
format: 'json',
139+
method: 'flickr.photos.search',
140+
extras: 'geo,url_s',
141+
per_page: 150,
142+
page: 1,
117143
bbox: [-180, -90, 180, 90]
118144
},
119-
format: new OpenLayers.Format.GML()
145+
callbackKey: 'jsoncallback',
146+
format: new OpenLayers.Format.Flickr()
120147
}),
121148
styleMap: new OpenLayers.StyleMap({
122149
"default": style,
@@ -172,7 +199,7 @@
172199
<body onload="init()">
173200
<h1 id="title">Cluster Strategy Example</h1>
174201
<div id="tags">
175-
vector, feature, stylemap, wfs, cluster, strategy, cleanup
202+
vector, feature, stylemap, cluster, strategy, flickr, script
176203
</div>
177204
<p id="shortdesc">
178205
Uses a cluster strategy to render points representing clusters of features.
@@ -181,6 +208,8 @@ <h1 id="title">Cluster Strategy Example</h1>
181208
<div id="docs">
182209
<p>The Cluster strategy lets you display points representing clusters
183210
of features within some pixel distance.</p>
211+
<p>This particular example uses the <a
212+
href="http://www.flickr.com/services/api/">Flickr API.</a></p>
184213
</div>
185214
<div id="photos"></div>
186215
<p>Hover over a cluster on the map to see the photos it includes.</p>

examples/strategy-paging.html

Lines changed: 51 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -10,20 +10,45 @@
1010
<script src="../lib/OpenLayers.js"></script>
1111
<script type="text/javascript">
1212
var map, photos, paging;
13-
OpenLayers.ProxyHost = (window.location.host == "localhost") ?
14-
"/cgi-bin/proxy.cgi?url=" : "proxy.cgi?url=";
13+
14+
/**
15+
* A specific format for parsing Flickr API JSON responses.
16+
*/
17+
OpenLayers.Format.Flickr = OpenLayers.Class(OpenLayers.Format, {
18+
read: function(obj) {
19+
if(obj.stat === 'fail') {
20+
throw new Error(
21+
['Flickr failure response (',
22+
obj.code,
23+
'): ',
24+
obj.message].join(''));
25+
}
26+
if(!obj || !obj.photos ||
27+
!OpenLayers.Util.isArray(obj.photos.photo)) {
28+
throw new Error(
29+
'Unexpected Flickr response');
30+
}
31+
var photos = obj.photos.photo, photo,
32+
x, y, point,
33+
feature, features = [];
34+
for(var i=0,l=photos.length; i<l; i++) {
35+
photo = photos[i];
36+
x = photo.longitude;
37+
y = photo.latitude;
38+
point = new OpenLayers.Geometry.Point(x, y);
39+
feature = new OpenLayers.Feature.Vector(point, {
40+
title: photo.title,
41+
img_url: photo.url_s
42+
});
43+
features.push(feature);
44+
}
45+
return features;
46+
}
47+
});
1548

1649
function init() {
17-
map = new OpenLayers.Map('map', {
18-
restrictedExtent: new OpenLayers.Bounds(-180, -90, 180, 90)
19-
});
20-
var base = new OpenLayers.Layer.WMS("Imagery",
21-
["http://t1.hypercube.telascience.org/tiles?",
22-
"http://t2.hypercube.telascience.org/tiles?",
23-
"http://t3.hypercube.telascience.org/tiles?",
24-
"http://t4.hypercube.telascience.org/tiles?"],
25-
{layers: 'landsat7'}
26-
);
50+
map = new OpenLayers.Map('map');
51+
var base = new OpenLayers.Layer.OSM();
2752

2853
var style = new OpenLayers.Style({
2954
externalGraphic: "${img_url}",
@@ -33,19 +58,21 @@
3358
paging = new OpenLayers.Strategy.Paging();
3459

3560
photos = new OpenLayers.Layer.Vector("Photos", {
61+
projection: "EPSG:4326",
3662
strategies: [new OpenLayers.Strategy.Fixed(), paging],
37-
protocol: new OpenLayers.Protocol.HTTP({
38-
url: "http://labs.metacarta.com/flickrbrowse/flickr.py/flickr",
63+
protocol: new OpenLayers.Protocol.Script({
64+
url: "http://api.flickr.com/services/rest",
3965
params: {
40-
format: "WFS",
41-
sort: "interestingness-desc",
42-
service: "WFS",
43-
request: "GetFeatures",
44-
srs: "EPSG:4326",
45-
maxfeatures: 100,
66+
api_key: 'b5e8c0e287e678671c3d8b2c0f3ced85',
67+
format: 'json',
68+
method: 'flickr.photos.search',
69+
extras: 'geo,url_s',
70+
per_page: 100,
71+
page: 1,
4672
bbox: [-180, -90, 180, 90]
4773
},
48-
format: new OpenLayers.Format.GML()
74+
callbackKey: 'jsoncallback',
75+
format: new OpenLayers.Format.Flickr()
4976
}),
5077
styleMap: new OpenLayers.StyleMap(style)
5178
});
@@ -66,7 +93,7 @@
6693
<body onload="init()">
6794
<h1 id="title">Paging Strategy Example</h1>
6895
<div id="tags">
69-
vector, feature, stylemap, wfs, paging, strategy, cleanup
96+
vector, feature, stylemap, paging, strategy, flickr, script
7097
</div>
7198
<p id="shortdesc">
7299
Uses a paging strategy to cache large batches of features and render a page at a time.
@@ -81,6 +108,8 @@ <h1 id="title">Paging Strategy Example</h1>
81108
that do not support paging on the server. In this case, the protocol requests a
82109
batch of 100 features, the strategy caches those and supplies a single
83110
page at a time to the layer.</p>
111+
<p>This particular example uses the <a
112+
href="http://www.flickr.com/services/api/">Flickr API.</a></p>
84113
</div>
85114
</body>
86115
</html>

0 commit comments

Comments
 (0)