[OpenLayers-Users] populate vector layer from json response

Nicholas Efremov-Kendall n.e.kendall at gmail.com
Tue Jun 21 12:57:37 EDT 2011


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/9e08decf/attachment-0001.html


More information about the Users mailing list