[OpenLayers-Users] populate vector layer from json response
Nicholas Efremov-Kendall
n.e.kendall at gmail.com
Tue Jun 21 12:37:58 EDT 2011
Well, here's the kicker:
tweet.point = new
OpenLayers.LonLat(tweet.geo.coordinates[0],tweet.geo.coordinates[1]).transform(new
OpenLayers.Projection("EPSG:900913"),map.getProjectionObject());
this returns two valid coordinates
but with epsg 4326: the lat is corrupted to NAN.
This cycles through the tweets correctly, but appears to break in OL at line
701 with the error a.geometry.getBounds is not a function...which I assume
has to do with why the markers don't get added to the map...
On Tue, Jun 21, 2011 at 11:10 AM, Nicholas Efremov-Kendall <
n.e.kendall at gmail.com> wrote:
> Hi Heath,
> I believe I am calling the function on the LonLat pair with the below code
>
> tweet.point = new
> OpenLayers.LonLat(tweet.geo.coordinates[0],tweet.geo.coordinates[1]).transform(new
> OpenLayers.Projection("EPSG:4326"),map.getProjectionObject());
>
> which returns POINT(NaN Nan) when I call an alert in the below function. If
> I don't call the transform function on the point, which works by the way
> with placing the geolocated position which centers the map to get the 50km
> radius for the tweets.
>
> I've tried your suggestion as well
>
> function parseTweetsQ(){
> if (tweetsQ.length > 0) {
> var tweet = tweetsQ.pop();
> if (tweet.geo){
> var latlon = new
> OpenLayers.LonLat(tweet.geo.coordinates[0],tweet.geo.coordinates[1]);
> latlon.transform(new
> OpenLayers.Projection("EPSG:4326"),map.getProjectionObject());
> tweet.point = latlon;
> tweet.attributes = {};
> plotTwt(tweet);
> }}}
>
> function plotTwt(tweet){
> twtpoint = new OpenLayers.Geometry.Point(tweet.point);
> alert(twtpoint);
> twtmark = new OpenLayers.Features.Vector(twtpoint);
> tweetz.addFeatures([twtmark]);
> }
>
> and I still get a POINT(Nan NaN) in the alert. I'm not sure what I'm doing
> wrong here, but the syntax follows from other examples, and I know I'm
> missing something really obvious here. If I call the alert in the parsetweet
> function, it appears that the lon is converted, but the lat is corrupted to
> a NaN...
>
> function plotTwt(tweet){
> twtpoint = new OpenLayers.Geometry.Point(tweet.point);
> alert(twtpoint);
> twtmark = new OpenLayers.Features.Vector(twtpoint);
> tweetz.addFeatures([twtmark]);
> alert(tweet.point);
> }
>
> Full code is below
>
> var feat, OpenLayers, latlon;
> var tweetz = new OpenLayers.Layer.Vector("Tweets", {styleMap: new
> OpenLayers.StyleMap({externalGraphic:
> "OpenLayers-2.11-rc1/img/marker-green.png", pointRadius: 10})});
> var marker = new OpenLayers.Layer.Vector("Marker", {styleMap: new
> OpenLayers.StyleMap({externalGraphic: "OpenLayers-2.11-rc1/img/marker.png",
> pointRadius: 10})});
> var map = new OpenLayers.Map('map');
> var tweets = [];
> var tweetsQ = [];
> var refreshQuery = '?=';
>
> function initGIS(){
> map.addControl(new OpenLayers.Control.LayerSwitcher());
> var mapnik = new OpenLayers.Layer.OSM();
> map.addLayer(mapnik);
> map.addLayer(tweetz);
> map.setCenter(new OpenLayers.LonLat(-90, 38).transform(new
> OpenLayers.Projection("EPSG:4326"),map.getProjectionObject()),12);
> $(document).everyTime('30s', acquireTweets);
> $(document).everyTime('100ms', parseTweetsQ);
> getLoc();}
>
>
> function getLoc(){
> if (Modernizr.geolocation) {
> navigator.geolocation.getCurrentPosition(plotLoc,handle_error);
> } else {
> yqlgeo.get('visitor',norm_yql_resp);
> }}
>
> function createTWTsrcURL (){
> var temp = map.getCenter().transform(new
> OpenLayers.Projection("EPSG:900913"),new
> OpenLayers.Projection("EPSG:4326"));
> return 'http://search.twitter.com/search.json' + refreshQuery +
> '&geocode=' + temp.lat +'%2C' + temp.lon + '%2C50km&rpp=100&callback=?';}
>
> function plotLoc (position){
> map.addLayer(marker);
> var feat = new OpenLayers.Feature.Vector(new
> OpenLayers.Geometry.Point(position.coords.longitude,position.coords.latitude).transform(new
> OpenLayers.Projection("EPSG:4326"),map.getProjectionObject()));
> marker.addFeatures([feat]);
> var bounds = marker.getDataExtent();
> map.zoomToExtent(bounds);
> acquireTweets();}
>
> function acquireTweets(){
> $.getJSON(createTWTsrcURL(), function(data){
> if(data.results)
> $.each(data.results, function(i, tweet){
> if (tweet.geo || tweet.location)
> tweetsQ.push(tweet);
> });
> refreshQuery = data.refresh_url;
> });}
>
> function parseTweetsQ(){
> if (tweetsQ.length > 0) {
> var tweet = tweetsQ.pop();
> if (tweet.geo){
> tweet.point = new
> OpenLayers.LonLat(tweet.geo.coordinates[0],tweet.geo.coordinates[1]).transform(new
> OpenLayers.Projection("EPSG:4326"),map.getProjectionObject());
> tweet.attributes = {};
> plotTwt(tweet);
> }}}
>
> function createInfoContent(tweet) {
> var retval = '';
> retval += '<div class="tweet_info">';
> retval += '<img alt="' + tweet.from_user_id + '" src="' +
> tweet.profile_image_url + '" class="tweet_profile"/>';
> retval += '<h3>' + tweet.from_user + '</h3>';
> retval += '<p>' + tweet.text + '</p>';
> retval += '<p>Source: <a href="' + tweet.source + '"/>' +
> tweet.source + '</a></p>';
> retval += '</div>';
> return retval;}
>
> function plotTwt(tweet){
> twtpoint = new OpenLayers.Geometry.Point(tweet.point);
> alert(twtpoint);
> twtmark = new OpenLayers.Features.Vector(twtpoint);
> tweetz.addFeatures([twtmark]);
> alert(tweet.point);}
>
>
> function handle_error(error) {
> switch(error.code){
> case error.PERMISSION_DENIED: alert("This application reguires you to agree
> to share your location. Please reload the page to see it work properly.
> There is a privacy disclaimer at the bottom of this page. This site does not
> currently record or store these data, and in the future will not record
> unique user information without informing the user or asking their
> permission. -Virtual Spatiality");
> break;
> case error.POSITION_UNAVAILABLE: alert("could not determine position");
> break;
> case error.TIMEOUT: alert("timeout retrieving position");
> break;
> default: alert("unknown error");
> break;}}
> function norm_yql_resp(response){
> if (response.error) {
> var error = {code : 0};
> handle_error(error);
> return;}var position = {coords:
> { latitude: response.place.centroid.latitude,
> longitude: response.place.centroid.longitude
> },
> address :
> {city: response.place.locality2.content,
> region: response.place.admin1.content,
> country: response.place.country.content
> }};handle_geolocation_query(position);}
> On Tue, Jun 21, 2011 at 10:44 AM, B. Heath Robinson <
> heath at midnighthour.org> wrote:
>
>> I should have proofread the email BEFORE I sent it.
>>
>> Actually, it would be something like this:
>>
>> var latlon = new
>> OpenLayers.LonLat(tweet.geo.coordinates[0],tweet.geo.coordinates[1]);
>> latlon.transform(new
>> OpenLayers.Projection("EPSG:4326"),map.getProjectionObject());
>> tweet.point = latlon;
>>
>> This assumes that tweet.geo.coordinates[0],tweet.geo.coordinates[1] is
>> something that the LonLat constructor will take.
>>
>> On Jun 21, 2011, at 10:39 AM, B. Heath Robinson wrote:
>>
>> Transform operates on the coordinates, it does not return a new
>> coordinates. You should use it like this:
>> var latlon = weet.geo.coordinates[0],tweet.geo.coordinates[1];
>> latlon.transform(new
>> OpenLayers.Projection("EPSG:4326"),map.getProjectionObject());
>>
>> tweet.point = latlon;
>>
>>
>> On Jun 21, 2011, at 10:21 AM, Nicholas Efremov-Kendall wrote:
>>
>> Hi guys thanks for the previous advice,
>>
>> I'm still running into an issue, and I'm not sure how to resolve it. When
>> I first use a OpenLayers.LonLat and transform the point, I get the lon
>> converted correctect, but the lat is returned NaN. If I don't transform it,
>> the coordinates remain correct.
>>
>> tweet.point = new
>> OpenLayers.LonLat(tweet.geo.coordinates[0],tweet.geo.coordinates[1]).transform(new
>> OpenLayers.Projection("EPSG:4326"),map.getProjectionObject());
>>
>> I've been playing around with some different iterations, and I can get
>> tweet.point to alert out with ever tweet that's pulled into the plotting
>> function, but the markers aren't added. The issue seems to be with how I'm
>> calling the transform function, because somehow after calling the function I
>> get NaN's for the lat-lon's inside the point object. I'm really hitting a
>> wall here.
>>
>>
>>
>> On Tue, Jun 21, 2011 at 3:23 AM, Nick Kendall <n.e.kendall at gmail.com>wrote:
>>
>>> Thanks! Will take another crack at this Tom!
>>>
>>> Sent from my mobile device
>>>
>>> On Jun 21, 2011, at 2:37 AM, "Sveen Atle Frenvik (Geomatikk IKT)" <
>>> Atle.Frenvik.Sveen at geomatikk.no> wrote:
>>>
>>> try using an OpenLayers.Geometry.Point instead of an OpenLayers.LonLat
>>>
>>> ie (untested, but i think this is rather correct):
>>>
>>> function parseTweetsQ(){
>>> if (tweetsQ.length > 0) {
>>> var tweet = tweetsQ.pop();
>>> if (tweet.geo){
>>> tweet.point = new
>>> OpenLayers.Geometry.Point(tweet.geo.coordinates[0],tweet.geo.coordinates[1]).transform(new
>>> OpenLayers.Projection("EPSG:4326"),map.getProjectionObject());
>>> tweet.attributes = {}; //in this you coukd stuff attributes
>>> of the tweet for easy access on clicks etc.
>>> plotTwt(tweet);
>>> }
>>> }
>>> }
>>>
>>> function plotTwt(tweet){
>>> //why do you keep adding the layer for each tweet?
>>> map.addLayer(tweetz);
>>> tweet.marker = new
>>> OpenLayers.Feature.Vector(tweet.point,{attributes:{tweet.attributes]});
>>> tweetz.addFeatures([tweet.marker]);
>>> }
>>>
>>>
>>>
>>> On 2011-06-21 05:00, Nicholas Efremov-Kendall wrote:
>>>
>>> Hi Phil et al,
>>>
>>> Thanks for your response. The code as is does iterate through the
>>> features as they are returned. I have a handle on it up to the plotting
>>> function. An alert on the tweet.marker object returns [object Object], while
>>> tweet.latlng returns readable coordinates lon=38.6834,lat=-90.4313. I guess
>>> what I'm unsure about is how to parse the object which is passed to the
>>> third function. Thanks again.
>>>
>>>
>>> function acquireTweets(){
>>> $.getJSON(createTWTsrcURL(), function(data){
>>> if(data.results)
>>> $.each(data.results, function(i, tweet){
>>> if (tweet.geo || tweet.location)
>>> tweetsQ.push(tweet);
>>> });
>>> refreshQuery = data.refresh_url;
>>> });}
>>>
>>> function parseTweetsQ(){
>>> if (tweetsQ.length > 0) {
>>> var tweet = tweetsQ.pop();
>>> if (tweet.geo){
>>> tweet.latlng = new
>>> OpenLayers.LonLat(tweet.geo.coordinates[0],tweet.geo.coordinates[1]);
>>> plotTwt(tweet);
>>> }}}
>>>
>>> function plotTwt(tweet){
>>> map.addLayer(tweetz);
>>> tweet.marker = new OpenLayers.Feature.Vector(new
>>> OpenLayers.Geometry.Point(tweet.latlng).transform(new
>>> OpenLayers.Projection("EPSG:4326"),map.getProjectionObject()));
>>> tweetz.addFeatures([tweet.marker]);}
>>>
>>>
>>>
>>>
>>> On Mon, Jun 20, 2011 at 9:13 PM, Phil Scadden < <p.scadden at gns.cri.nz>
>>> p.scadden at gns.cri.nz> wrote:
>>>
>>>> I have no idea what the object returned by twitter is but surely, but if
>>>> you are using jsonp, then
>>>> have in your code something like:
>>>> jsonp_function(json)
>>>> where jsonp_function is the name of jsonp callback and json is the
>>>> returned object. I would guess it contains an array of feature type
>>>> objects, so you would iterate through the array, creating feature for
>>>> each row, and calling vectorLayer.addFeatures(features) to add them to
>>>> the vector layer.
>>>>
>>>> Notice: This email and any attachments are confidential. If received in
>>>> error please destroy and immediately notify us. Do not copy or disclose the
>>>> contents.
>>>>
>>>> _______________________________________________
>>>> Users mailing list
>>>> <Users at lists.osgeo.org>Users at lists.osgeo.org
>>>> <http://lists.osgeo.org/mailman/listinfo/openlayers-users>
>>>> http://lists.osgeo.org/mailman/listinfo/openlayers-users
>>>>
>>>
>>>
>>> _______________________________________________
>>> Users mailing list <Users at lists.osgeo.org>Users at lists.osgeo.org <http://lists.osgeo.org/mailman/listinfo/openlayers-users>http://lists.osgeo.org/mailman/listinfo/openlayers-users
>>>
>>>
>>>
>>> --
>>> Atle Frenvik Sveen
>>> Utvikler
>>> Geomatikk IKT AS
>>> tlf: 45 27 86 89 <atle.frenvik.sveen at geomatikk.no>atle.frenvik.sveen at geomatikk.no
>>>
>>> _______________________________________________
>>> Users mailing list
>>> Users at lists.osgeo.org
>>> http://lists.osgeo.org/mailman/listinfo/openlayers-users
>>>
>>>
>> _______________________________________________
>> Users mailing list
>> Users at lists.osgeo.org
>> http://lists.osgeo.org/mailman/listinfo/openlayers-users
>>
>>
>> _______________________________________________
>> Users mailing list
>> Users at lists.osgeo.org
>> http://lists.osgeo.org/mailman/listinfo/openlayers-users
>>
>>
>>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.osgeo.org/pipermail/openlayers-users/attachments/20110621/5ebd6a12/attachment-0001.html
More information about the Users
mailing list