[OpenLayers-Users] populate vector layer from json response

Nicholas Efremov-Kendall n.e.kendall at gmail.com
Tue Jun 21 13:51:23 EDT 2011


The error seems to be in the coordinates which the twitter json is spitting
out. Depending what twitter is spitting back to me, the coords are either
valid, or nan...or I assume they're valid. I might just try to do this over
with epsg 900913 as the projection and see if I can side-step this horro
alltogether...

On Tue, Jun 21, 2011 at 11:57 AM, Nicholas Efremov-Kendall <
n.e.kendall at gmail.com> wrote:

> Per a previous suggestion of Ian's the following seems to work and produces
> valid coordinates for both lat and lon
>
> tweet.point = new
> OpenLayers.LonLat(tweet.geo.coordinates[0],tweet.geo.coordinates[1]).transform(new
> OpenLayers.Projection("EPSG:4326"),new
> OpenLayers.Projection("EPSG:900913"));
>
> however, I still get the error at line 701 with "a.geometry.getBounds is
> not a function" in firebug. Chrome doesn't produce an error, but doesn't add
> the markers...
>
>
> On Tue, Jun 21, 2011 at 11:37 AM, Nicholas Efremov-Kendall <
> n.e.kendall at gmail.com> wrote:
>
>> 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/af542b09/attachment-0001.html


More information about the Users mailing list