thr3ads.net - Rails - how to use javascript to update markers on Google maps [Dec 2011]

If this information is useful, please help other people find it:
Share via:

skrite

2011-Dec-07 19:40 UTC

how to use javascript to update markers on Google maps

Hey all,
i have a google map and i am drawing circles on the map like this..


 var latlng = new google.maps.LatLng(35.931387,
-102.31062);
    var myMapOptions {
      zoom:
12,
      center:
latlng,
      mapTypeId:
google.maps.MapTypeId.HYBRID
    };

    var map = new
google.maps.Map(document.getElementById("map_canvas"),
myMapOptions);
    var infoWindow = new
google.maps.InfoWindow();
    var markerBounds = new
google.maps.LatLngBounds();


   <% @mapped_sites.each do |row|
%>

        // main
circle
        center = new google.maps.LatLng(<%= "#{row[0]}" %>,
<%"#{row[1]}"
%>);
        siteCircle makeMarker({
          position:
center,
          strokeColor:
"#FF0000",
          strokeOpacity:
0.8,
          strokeWeight:
2,
          fillColor: ''<%= "#{row[7]}"
%>'',
          fillOpacity:
0.75,
          radius:
560,
          map:
map,
          center:
center,
          radius: <%= "#{row[2]}"
%>,
          title: ''<%= "#{row[5]}"
%>'',
          content: ''<%= "some contnet
%>''
       });

       markerArray.push(siteCircle);

my question is, that since the fillColor is going to change from time
to time, i want to update all the colors of the circles periodically.
What i don''t know how to do is get the equivelent to the
@mapped_sites  because if i could, i think i could just delete the
existing circles and draw new ones.

How do i get info back from the server periodically to update the
circle colors?

thanks to all.
skrite



-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

L.Karthikeyan

2011-Dec-09 01:49 UTC

head link

Re: how to use javascript to update markers on Google maps

Hi,

      For this you need to use rjs Ajax request. Please refer the
following links, you will get an idea.

1. http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
2. http://railscasts.com/episodes/229-polling-for-changes?autoplay=true

On Thu, Dec 8, 2011 at 1:10 AM, skrite
<shawn-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org>
wrote:>
> Hey all,
> i have a google map and i am drawing circles on the map like this..
>
>
>  var latlng = new google.maps.LatLng(35.931387,
> -102.31062);
>    var myMapOptions > {
>      zoom:
> 12,
>      center:
> latlng,
>      mapTypeId:
> google.maps.MapTypeId.HYBRID
>    };
>
>    var map = new
> google.maps.Map(document.getElementById("map_canvas"),
> myMapOptions);
>    var infoWindow = new
> google.maps.InfoWindow();
>    var markerBounds = new
> google.maps.LatLngBounds();
>
>
>   <% @mapped_sites.each do |row|
> %>
>
>        // main
> circle
>        center = new google.maps.LatLng(<%= "#{row[0]}" %>,
<%> "#{row[1]}"
> %>);
>        siteCircle > makeMarker({
>          position:
> center,
>          strokeColor:
> "#FF0000",
>          strokeOpacity:
> 0.8,
>          strokeWeight:
> 2,
>          fillColor: ''<%= "#{row[7]}"
> %>'',
>          fillOpacity:
> 0.75,
>          radius:
> 560,
>          map:
> map,
>          center:
> center,
>          radius: <%= "#{row[2]}"
> %>,
>          title: ''<%= "#{row[5]}"
> %>'',
>          content: ''<%= "some contnet
> %>''
>       });
>
>       markerArray.push(siteCircle);
>
> my question is, that since the fillColor is going to change from time
> to time, i want to update all the colors of the circles periodically.
> What i don''t know how to do is get the equivelent to the
> @mapped_sites  because if i could, i think i could just delete the
> existing circles and draw new ones.
>
> How do i get info back from the server periodically to update the
> circle colors?
>
> thanks to all.
> skrite
>
>
>
> --
> You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
> For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.
>


--

Regards,
L.KarthiKeyan.

-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

skrite

2011-Dec-09 15:04 UTC

head link

Re: how to use javascript to update markers on Google maps

Hey, thanks for these links, very helpful.
-sk

On Dec 8, 7:49 pm, "L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> Hi,
>
>       For this you need to use rjs Ajax request. Please refer the
> following links, you will get an idea.
>
> 1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
> 2.http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
>
>
>
>
>
>
>
>
>
> On Thu, Dec 8, 2011 at 1:10 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> > Hey all,
> > i have a google map and i am drawing circles on the map like this..
>
> >  var latlng = new google.maps.LatLng(35.931387,
> > -102.31062);
> >    var myMapOptions > > {
> >      zoom:
> > 12,
> >      center:
> > latlng,
> >      mapTypeId:
> > google.maps.MapTypeId.HYBRID
> >    };
>
> >    var map = new
> > google.maps.Map(document.getElementById("map_canvas"),
> > myMapOptions);
> >    var infoWindow = new
> > google.maps.InfoWindow();
> >    var markerBounds = new
> > google.maps.LatLngBounds();
>
> >   <% @mapped_sites.each do |row|
> > %>
>
> >        // main
> > circle
> >        center = new google.maps.LatLng(<%= "#{row[0]}"
%>, <%> > "#{row[1]}"
> > %>);
> >        siteCircle > > makeMarker({
> >          position:
> > center,
> >          strokeColor:
> > "#FF0000",
> >          strokeOpacity:
> > 0.8,
> >          strokeWeight:
> > 2,
> >          fillColor: ''<%= "#{row[7]}"
> > %>'',
> >          fillOpacity:
> > 0.75,
> >          radius:
> > 560,
> >          map:
> > map,
> >          center:
> > center,
> >          radius: <%= "#{row[2]}"
> > %>,
> >          title: ''<%= "#{row[5]}"
> > %>'',
> >          content: ''<%= "some contnet
> > %>''
> >       });
>
> >       markerArray.push(siteCircle);
>
> > my question is, that since the fillColor is going to change from time
> > to time, i want to update all the colors of the circles periodically.
> > What i don''t know how to do is get the equivelent to the
> > @mapped_sites  because if i could, i think i could just delete the
> > existing circles and draw new ones.
>
> > How do i get info back from the server periodically to update the
> > circle colors?
>
> > thanks to all.
> > skrite
>
> > --
> > You received this message because you are subscribed to the Google
Groups "Ruby on Rails: Talk" group.
> > To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > For more options, visit this group
athttp://groups.google.com/group/rubyonrails-talk?hl=en.
>
> --
>
> Regards,
> L.KarthiKeyan.
-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

Jim Ruther Nill

2011-Dec-09 15:48 UTC

head link

Re: Re: how to use javascript to update markers on Google maps

On Fri, Dec 9, 2011 at 11:04 PM, skrite
<shawn-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> Hey, thanks for these links, very helpful.
> -sk
>
> On Dec 8, 7:49 pm, "L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > Hi,
> >
> >       For this you need to use rjs Ajax request. Please refer the
> > following links, you will get an idea.
> >
> > 1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
> > 2.http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
> >
>
one more option is to keep @mapped_sites to a javascript variable so you
dont have to use ajax.  you might also want to move the makeMarker part
to a js function to tidy up the view and just call that function when you
need
to update the colors

something along the lines of

var sites = <%= @mapped_sites.to_json %>;
addCircles(sites);

function addCircles(circles) {
  for(i=0; i<circles.length; i++) {
    center = new google.maps.LatLng(circles[i][0], circles[i][1]);
    siteCircle = makeMarker({
      position: center,
      strokeColor: "#FF0000",
      strokeOpacity: 0.8,
      strokeWeight: 2,
      fillColor: circles[i][7],
      fillOpacity: 0.75,
      radius: 560,
      map: map,
      center: center,
      radius: circles[i][2],
      title: circles[i][5],
      content: ''content''
    });
  }
}

then you just need to update the sites variable using js. no need
to go back to the server.


> >
> >
> >
> >
> >
> >
> >
> >
> > On Thu, Dec 8, 2011 at 1:10 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >
> > > Hey all,
> > > i have a google map and i am drawing circles on the map like
this..
> >
> > >  var latlng = new google.maps.LatLng(35.931387,
> > > -102.31062);
> > >    var myMapOptions > > > {
> > >      zoom:
> > > 12,
> > >      center:
> > > latlng,
> > >      mapTypeId:
> > > google.maps.MapTypeId.HYBRID
> > >    };
> >
> > >    var map = new
> > > google.maps.Map(document.getElementById("map_canvas"),
> > > myMapOptions);
> > >    var infoWindow = new
> > > google.maps.InfoWindow();
> > >    var markerBounds = new
> > > google.maps.LatLngBounds();
> >
> > >   <% @mapped_sites.each do |row|
> > > %>
> >
> > >        // main
> > > circle
> > >        center = new google.maps.LatLng(<%=
"#{row[0]}" %>, <%> > > "#{row[1]}"
> > > %>);
> > >        siteCircle > > > makeMarker({
> > >          position:
> > > center,
> > >          strokeColor:
> > > "#FF0000",
> > >          strokeOpacity:
> > > 0.8,
> > >          strokeWeight:
> > > 2,
> > >          fillColor: ''<%= "#{row[7]}"
> > > %>'',
> > >          fillOpacity:
> > > 0.75,
> > >          radius:
> > > 560,
> > >          map:
> > > map,
> > >          center:
> > > center,
> > >          radius: <%= "#{row[2]}"
> > > %>,
> > >          title: ''<%= "#{row[5]}"
> > > %>'',
> > >          content: ''<%= "some contnet
> > > %>''
> > >       });
> >
> > >       markerArray.push(siteCircle);
> >
> > > my question is, that since the fillColor is going to change from
time
> > > to time, i want to update all the colors of the circles
periodically.
> > > What i don''t know how to do is get the equivelent to the
> > > @mapped_sites  because if i could, i think i could just delete
the
> > > existing circles and draw new ones.
> >
> > > How do i get info back from the server periodically to update the
> > > circle colors?
> >
> > > thanks to all.
> > > skrite
> >
> > > --
> > > You received this message because you are subscribed to the
Google
> Groups "Ruby on Rails: Talk" group.
> > > To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> .
> > > To unsubscribe from this group, send email to
>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > For more options, visit this group athttp://
> groups.google.com/group/rubyonrails-talk?hl=en.
> >
> > --
> >
> > Regards,
> > L.KarthiKeyan.
>
> --
> You received this message because you are subscribed to the Google Groups
> "Ruby on Rails: Talk" group.
> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> To unsubscribe from this group, send email to
>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> For more options, visit this group at
> http://groups.google.com/group/rubyonrails-talk?hl=en.
>
>

-- 
-------------------------------------------------------------
visit my blog at http://jimlabs.heroku.com

-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

skrite

2011-Dec-09 19:56 UTC

head link

Re: how to use javascript to update markers on Google maps

I am intrigued by this solution, Jim.
i have a couple of questions, as it seems this is a cleaner way than
what I am trying to do.
The values that determine the circle color are in the database, and
can change while the page is loaded. This is why i need them to
update.
So, somehow i still need to go to the server for that. I guess i am
missing the part about how to get the @mapped_sites variable to the
controller and back again to the page to rebuild the circles.
Thanks for your time on this.
sk

On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> On Fri, Dec 9, 2011 at 11:04 PM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> > Hey, thanks for these links, very helpful.
> > -sk
>
> > On Dec 8, 7:49 pm, "L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > > Hi,
>
> > >       For this you need to use rjs Ajax request. Please refer the
> > > following links, you will get an idea.
>
> > > 1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
> > >
2.http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
>
> one more option is to keep @mapped_sites to a javascript variable so you
> dont have to use ajax.  you might also want to move the makeMarker part
> to a js function to tidy up the view and just call that function when you
> need
> to update the colors
>
> something along the lines of
>
> var sites = <%= @mapped_sites.to_json %>;
> addCircles(sites);
>
> function addCircles(circles) {
>   for(i=0; i<circles.length; i++) {
>     center = new google.maps.LatLng(circles[i][0], circles[i][1]);
>     siteCircle = makeMarker({
>       position: center,
>       strokeColor: "#FF0000",
>       strokeOpacity: 0.8,
>       strokeWeight: 2,
>       fillColor: circles[i][7],
>       fillOpacity: 0.75,
>       radius: 560,
>       map: map,
>       center: center,
>       radius: circles[i][2],
>       title: circles[i][5],
>       content: ''content''
>     });
>   }
>
> }
>
> then you just need to update the sites variable using js. no need
> to go back to the server.
>
>
>
>
>
>
>
>
>
>
>
> > > On Thu, Dec 8, 2011 at 1:10 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> > > > Hey all,
> > > > i have a google map and i am drawing circles on the map like
this..
>
> > > >  var latlng = new google.maps.LatLng(35.931387,
> > > > -102.31062);
> > > >    var myMapOptions > > > > {
> > > >      zoom:
> > > > 12,
> > > >      center:
> > > > latlng,
> > > >      mapTypeId:
> > > > google.maps.MapTypeId.HYBRID
> > > >    };
>
> > > >    var map = new
> > > >
google.maps.Map(document.getElementById("map_canvas"),
> > > > myMapOptions);
> > > >    var infoWindow = new
> > > > google.maps.InfoWindow();
> > > >    var markerBounds = new
> > > > google.maps.LatLngBounds();
>
> > > >   <% @mapped_sites.each do |row|
> > > > %>
>
> > > >        // main
> > > > circle
> > > >        center = new google.maps.LatLng(<%=
"#{row[0]}" %>, <%> > > > "#{row[1]}"
> > > > %>);
> > > >        siteCircle > > > > makeMarker({
> > > >          position:
> > > > center,
> > > >          strokeColor:
> > > > "#FF0000",
> > > >          strokeOpacity:
> > > > 0.8,
> > > >          strokeWeight:
> > > > 2,
> > > >          fillColor: ''<%= "#{row[7]}"
> > > > %>'',
> > > >          fillOpacity:
> > > > 0.75,
> > > >          radius:
> > > > 560,
> > > >          map:
> > > > map,
> > > >          center:
> > > > center,
> > > >          radius: <%= "#{row[2]}"
> > > > %>,
> > > >          title: ''<%= "#{row[5]}"
> > > > %>'',
> > > >          content: ''<%= "some contnet
> > > > %>''
> > > >       });
>
> > > >       markerArray.push(siteCircle);
>
> > > > my question is, that since the fillColor is going to change
from time
> > > > to time, i want to update all the colors of the circles
periodically.
> > > > What i don''t know how to do is get the equivelent
to the
> > > > @mapped_sites  because if i could, i think i could just
delete the
> > > > existing circles and draw new ones.
>
> > > > How do i get info back from the server periodically to
update the
> > > > circle colors?
>
> > > > thanks to all.
> > > > skrite
>
> > > > --
> > > > You received this message because you are subscribed to the
Google
> > Groups "Ruby on Rails: Talk" group.
> > > > To post to this group, send email to
rubyonrails-talk@googlegroups.com
> > .
> > > > To unsubscribe from this group, send email to
> >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > > For more options, visit this group athttp://
> > groups.google.com/group/rubyonrails-talk?hl=en.
>
> > > --
>
> > > Regards,
> > > L.KarthiKeyan.
>
> > --
> > You received this message because you are subscribed to the Google
Groups
> > "Ruby on Rails: Talk" group.
> > To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > To unsubscribe from this group, send email to
> >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > For more options, visit this group at
> >http://groups.google.com/group/rubyonrails-talk?hl=en.
>
> --
> -------------------------------------------------------------
> visit my blog athttp://jimlabs.heroku.com
-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

Jim Ruther Nill

2011-Dec-10 05:49 UTC

head link

Re: Re: how to use javascript to update markers on Google maps

On Sat, Dec 10, 2011 at 3:56 AM, skrite
<shawn-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> I am intrigued by this solution, Jim.
> i have a couple of questions, as it seems this is a cleaner way than
> what I am trying to do.
> The values that determine the circle color are in the database, and
> can change while the page is loaded. This is why i need them to
> update.
>
i''ll still go with my suggestion earlier.  To update the colors, just
update
the sites variable after completing the ajax request and then call
addCircles

your ajax call may look like the following (this is totally untested :D)

$.ajax({
  url: your_url_here_that_returns_json_equivalent_of_@mapped_sites,
  success: function(data) {
    addCircles(data);
  }
});

> So, somehow i still need to go to the server for that. I guess i am
> missing the part about how to get the @mapped_sites variable to the
> controller and back again to the page to rebuild the circles.
> Thanks for your time on this.
> sk
>
> On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > On Fri, Dec 9, 2011 at 11:04 PM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> > > Hey, thanks for these links, very helpful.
> > > -sk
> >
> > > On Dec 8, 7:49 pm, "L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > > > Hi,
> >
> > > >       For this you need to use rjs Ajax request. Please
refer the
> > > > following links, you will get an idea.
> >
> > > >
1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
> > > > 2.
> http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
> >
> > one more option is to keep @mapped_sites to a javascript variable so
you
> > dont have to use ajax.  you might also want to move the makeMarker
part
> > to a js function to tidy up the view and just call that function when
you
> > need
> > to update the colors
> >
> > something along the lines of
> >
> > var sites = <%= @mapped_sites.to_json %>;
> > addCircles(sites);
> >
> > function addCircles(circles) {
> >   for(i=0; i<circles.length; i++) {
> >     center = new google.maps.LatLng(circles[i][0], circles[i][1]);
> >     siteCircle = makeMarker({
> >       position: center,
> >       strokeColor: "#FF0000",
> >       strokeOpacity: 0.8,
> >       strokeWeight: 2,
> >       fillColor: circles[i][7],
> >       fillOpacity: 0.75,
> >       radius: 560,
> >       map: map,
> >       center: center,
> >       radius: circles[i][2],
> >       title: circles[i][5],
> >       content: ''content''
> >     });
> >   }
> >
> > }
> >
> > then you just need to update the sites variable using js. no need
> > to go back to the server.
> >
> >
> >
> >
> >
> >
> >
> >
> >
> >
> >
> > > > On Thu, Dec 8, 2011 at 1:10 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >
> > > > > Hey all,
> > > > > i have a google map and i am drawing circles on the map
like this..
> >
> > > > >  var latlng = new google.maps.LatLng(35.931387,
> > > > > -102.31062);
> > > > >    var myMapOptions > > > > > {
> > > > >      zoom:
> > > > > 12,
> > > > >      center:
> > > > > latlng,
> > > > >      mapTypeId:
> > > > > google.maps.MapTypeId.HYBRID
> > > > >    };
> >
> > > > >    var map = new
> > > > >
google.maps.Map(document.getElementById("map_canvas"),
> > > > > myMapOptions);
> > > > >    var infoWindow = new
> > > > > google.maps.InfoWindow();
> > > > >    var markerBounds = new
> > > > > google.maps.LatLngBounds();
> >
> > > > >   <% @mapped_sites.each do |row|
> > > > > %>
> >
> > > > >        // main
> > > > > circle
> > > > >        center = new google.maps.LatLng(<%=
"#{row[0]}" %>, <%> > > > > "#{row[1]}"
> > > > > %>);
> > > > >        siteCircle > > > > > makeMarker({
> > > > >          position:
> > > > > center,
> > > > >          strokeColor:
> > > > > "#FF0000",
> > > > >          strokeOpacity:
> > > > > 0.8,
> > > > >          strokeWeight:
> > > > > 2,
> > > > >          fillColor: ''<%=
"#{row[7]}"
> > > > > %>'',
> > > > >          fillOpacity:
> > > > > 0.75,
> > > > >          radius:
> > > > > 560,
> > > > >          map:
> > > > > map,
> > > > >          center:
> > > > > center,
> > > > >          radius: <%= "#{row[2]}"
> > > > > %>,
> > > > >          title: ''<%= "#{row[5]}"
> > > > > %>'',
> > > > >          content: ''<%= "some contnet
> > > > > %>''
> > > > >       });
> >
> > > > >       markerArray.push(siteCircle);
> >
> > > > > my question is, that since the fillColor is going to
change from
> time
> > > > > to time, i want to update all the colors of the circles
> periodically.
> > > > > What i don''t know how to do is get the
equivelent to the
> > > > > @mapped_sites  because if i could, i think i could just
delete the
> > > > > existing circles and draw new ones.
> >
> > > > > How do i get info back from the server periodically to
update the
> > > > > circle colors?
> >
> > > > > thanks to all.
> > > > > skrite
> >
> > > > > --
> > > > > You received this message because you are subscribed to
the Google
> > > Groups "Ruby on Rails: Talk" group.
> > > > > To post to this group, send email to
> rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> > > .
> > > > > To unsubscribe from this group, send email to
> > >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > > > For more options, visit this group athttp://
> > > groups.google.com/group/rubyonrails-talk?hl=en.
> >
> > > > --
> >
> > > > Regards,
> > > > L.KarthiKeyan.
> >
> > > --
> > > You received this message because you are subscribed to the
Google
> Groups
> > > "Ruby on Rails: Talk" group.
> > > To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> .
> > > To unsubscribe from this group, send email to
> > >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > For more options, visit this group at
> > >http://groups.google.com/group/rubyonrails-talk?hl=en.
> >
> > --
> > -------------------------------------------------------------
> > visit my blog athttp://jimlabs.heroku.com
>
> --
> You received this message because you are subscribed to the Google Groups
> "Ruby on Rails: Talk" group.
> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> To unsubscribe from this group, send email to
>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> For more options, visit this group at
> http://groups.google.com/group/rubyonrails-talk?hl=en.
>
>

-- 
-------------------------------------------------------------
visit my blog at http://jimlabs.heroku.com

-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

skrite

2011-Dec-12 22:08 UTC

head link

Re: how to use javascript to update markers on Google maps

I am doing something similar here. The website is built on rails 2.3.9
and
uses prototype.

Almost all of what i need to happen does, but i get to the point where
the update happens and nothing does.

// add circles to map as it
initializes
    addCircles(sites, map, markerArray,
lineArray);

    var pe = new
PeriodicalExecuter(refreshCircleMarkers.curry(markerArray, lineArray,
map),
33);

    function refreshCircleMarkers(markerArray, lineArray, map)
{

      // first we remove the existing markers in
place
      for(i=0; i<markerArray.length; i++)
{
 
markerArray[i].setMap(null);
      }
      // and empty the array
itself
      markerArray [];

      var url = "/group/
update_mapv3_circles";
      new Ajax.Request(url,
{
        method:
''get'',
        onSuccess: function(response)
{
          var sites response.responseText;
          addCircles(sites, map, markerArray,
lineArray);
    }
      });


If i do an alert(response.responseText) the alert will show up and
display the contents of the @mapped_sites.to_json ( i am using
render :json => @mapped_sites.to_json in the controller).
Please let me know if you see something i am doing wrong.
Thanks for your help on this so far Jim.

sk


On Dec 9, 11:49 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> On Sat, Dec 10, 2011 at 3:56 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> > I am intrigued by this solution, Jim.
> > i have a couple of questions, as it seems this is a cleaner way than
> > what I am trying to do.
> > The values that determine the circle color are in the database, and
> > can change while the page is loaded. This is why i need them to
> > update.
>
> i''ll still go with my suggestion earlier.  To update the colors,
just update
> the sites variable after completing the ajax request and then call
> addCircles
>
> your ajax call may look like the following (this is totally untested :D)
>
> $.ajax({
>   url: your_url_here_that_returns_json_equivalent_of_@mapped_sites,
>   success: function(data) {
>     addCircles(data);
>   }
>
>
>
>
>
>
>
>
>
> });
> > So, somehow i still need to go to the server for that. I guess i am
> > missing the part about how to get the @mapped_sites variable to the
> > controller and back again to the page to rebuild the circles.
> > Thanks for your time on this.
> > sk
>
> > On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > > On Fri, Dec 9, 2011 at 11:04 PM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> > > > Hey, thanks for these links, very helpful.
> > > > -sk
>
> > > > On Dec 8, 7:49 pm, "L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > > > > Hi,
>
> > > > >       For this you need to use rjs Ajax request. Please
refer the
> > > > > following links, you will get an idea.
>
> > > > >
1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
> > > > > 2.
> >http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
>
> > > one more option is to keep @mapped_sites to a javascript variable
so you
> > > dont have to use ajax.  you might also want to move the
makeMarker part
> > > to a js function to tidy up the view and just call that function
when you
> > > need
> > > to update the colors
>
> > > something along the lines of
>
> > > var sites = <%= @mapped_sites.to_json %>;
> > > addCircles(sites);
>
> > > function addCircles(circles) {
> > >   for(i=0; i<circles.length; i++) {
> > >     center = new google.maps.LatLng(circles[i][0],
circles[i][1]);
> > >     siteCircle = makeMarker({
> > >       position: center,
> > >       strokeColor: "#FF0000",
> > >       strokeOpacity: 0.8,
> > >       strokeWeight: 2,
> > >       fillColor: circles[i][7],
> > >       fillOpacity: 0.75,
> > >       radius: 560,
> > >       map: map,
> > >       center: center,
> > >       radius: circles[i][2],
> > >       title: circles[i][5],
> > >       content: ''content''
> > >     });
> > >   }
>
> > > }
>
> > > then you just need to update the sites variable using js. no need
> > > to go back to the server.
>
> > > > > On Thu, Dec 8, 2011 at 1:10 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> > > > > > Hey all,
> > > > > > i have a google map and i am drawing circles on
the map like this..
>
> > > > > >  var latlng = new google.maps.LatLng(35.931387,
> > > > > > -102.31062);
> > > > > >    var myMapOptions > > > > > >
{
> > > > > >      zoom:
> > > > > > 12,
> > > > > >      center:
> > > > > > latlng,
> > > > > >      mapTypeId:
> > > > > > google.maps.MapTypeId.HYBRID
> > > > > >    };
>
> > > > > >    var map = new
> > > > > >
google.maps.Map(document.getElementById("map_canvas"),
> > > > > > myMapOptions);
> > > > > >    var infoWindow = new
> > > > > > google.maps.InfoWindow();
> > > > > >    var markerBounds = new
> > > > > > google.maps.LatLngBounds();
>
> > > > > >   <% @mapped_sites.each do |row|
> > > > > > %>
>
> > > > > >        // main
> > > > > > circle
> > > > > >        center = new google.maps.LatLng(<%=
"#{row[0]}" %>, <%> > > > > >
"#{row[1]}"
> > > > > > %>);
> > > > > >        siteCircle > > > > > >
makeMarker({
> > > > > >          position:
> > > > > > center,
> > > > > >          strokeColor:
> > > > > > "#FF0000",
> > > > > >          strokeOpacity:
> > > > > > 0.8,
> > > > > >          strokeWeight:
> > > > > > 2,
> > > > > >          fillColor: ''<%=
"#{row[7]}"
> > > > > > %>'',
> > > > > >          fillOpacity:
> > > > > > 0.75,
> > > > > >          radius:
> > > > > > 560,
> > > > > >          map:
> > > > > > map,
> > > > > >          center:
> > > > > > center,
> > > > > >          radius: <%= "#{row[2]}"
> > > > > > %>,
> > > > > >          title: ''<%=
"#{row[5]}"
> > > > > > %>'',
> > > > > >          content: ''<%= "some
contnet
> > > > > > %>''
> > > > > >       });
>
> > > > > >       markerArray.push(siteCircle);
>
> > > > > > my question is, that since the fillColor is going
to change from
> > time
> > > > > > to time, i want to update all the colors of the
circles
> > periodically.
> > > > > > What i don''t know how to do is get the
equivelent to the
> > > > > > @mapped_sites  because if i could, i think i could
just delete the
> > > > > > existing circles and draw new ones.
>
> > > > > > How do i get info back from the server
periodically to update the
> > > > > > circle colors?
>
> > > > > > thanks to all.
> > > > > > skrite
>
> > > > > > --
> > > > > > You received this message because you are
subscribed to the Google
> > > > Groups "Ruby on Rails: Talk" group.
> > > > > > To post to this group, send email to
> > rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> > > > .
> > > > > > To unsubscribe from this group, send email to
> > > >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > > > > For more options, visit this group athttp://
> > > > groups.google.com/group/rubyonrails-talk?hl=en.
>
> > > > > --
>
> > > > > Regards,
> > > > > L.KarthiKeyan.
>
> > > > --
> > > > You received this message because you are subscribed to the
Google
> > Groups
> > > > "Ruby on Rails: Talk" group.
> > > > To post to this group, send email to
rubyonrails-talk@googlegroups.com
> > .
> > > > To unsubscribe from this group, send email to
> > > >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > > For more options, visit this group at
> > > >http://groups.google.com/group/rubyonrails-talk?hl=en.
>
> > > --
> > > -------------------------------------------------------------
> > > visit my blog athttp://jimlabs.heroku.com
>
> > --
> > You received this message because you are subscribed to the Google
Groups
> > "Ruby on Rails: Talk" group.
> > To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > To unsubscribe from this group, send email to
> >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > For more options, visit this group at
> >http://groups.google.com/group/rubyonrails-talk?hl=en.
>
> --
> -------------------------------------------------------------
> visit my blog athttp://jimlabs.heroku.com
-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

Jim Ruther Nill

2011-Dec-13 00:22 UTC

head link

Re: Re: how to use javascript to update markers on Google maps

On Tue, Dec 13, 2011 at 6:08 AM, skrite
<shawn-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> I am doing something similar here. The website is built on rails 2.3.9
> and
> uses prototype.
>
> Almost all of what i need to happen does, but i get to the point where
> the update happens and nothing does.
>
> // add circles to map as it initializes
>    addCircles(sites, map, markerArray, lineArray);
>
>    var pe = new PeriodicalExecuter(refreshCircleMarkers.curry(markerArray,
> lineArray, map), 33);
>
> function refreshCircleMarkers(markerArray, lineArray, map) {
>   // first we remove the existing markers in place
>   for(i=0; i<markerArray.length; i++) {
>     markerArray[i].setMap(null);
>   }
>
  // and empty the array itself>   markerArray = [];
>
>   var url = "/group/update_mapv3_circles";
>   new Ajax.Request(url, {
>     method: ''get'',
>     onSuccess: function(response) {
>       var sites = response.responseText;
>       addCircles(sites, map, markerArray, lineArray);
>     }
>   });
>
>I see nothing wrong. Does the addCircles function expect a JSON
object for the first param?  The only reason I can think why this isn''t
working
is a type mismatch.

>
> If i do an alert(response.responseText) the alert will show up and
> display the contents of the @mapped_sites.to_json ( i am using
> render :json => @mapped_sites.to_json in the controller).
> Please let me know if you see something i am doing wrong.
> Thanks for your help on this so far Jim.
>
> sk
>
>
> On Dec 9, 11:49 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > On Sat, Dec 10, 2011 at 3:56 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> > > I am intrigued by this solution, Jim.
> > > i have a couple of questions, as it seems this is a cleaner way
than
> > > what I am trying to do.
> > > The values that determine the circle color are in the database,
and
> > > can change while the page is loaded. This is why i need them to
> > > update.
> >
> > i''ll still go with my suggestion earlier.  To update the
colors, just
> update
> > the sites variable after completing the ajax request and then call
> > addCircles
> >
> > your ajax call may look like the following (this is totally untested
:D)
> >
> > $.ajax({
> >   url: your_url_here_that_returns_json_equivalent_of_@mapped_sites,
> >   success: function(data) {
> >     addCircles(data);
> >   }
> >
> >
> >
> >
> >
> >
> >
> >
> >
> > });
> > > So, somehow i still need to go to the server for that. I guess i
am
> > > missing the part about how to get the @mapped_sites variable to
the
> > > controller and back again to the page to rebuild the circles.
> > > Thanks for your time on this.
> > > sk
> >
> > > On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > > > On Fri, Dec 9, 2011 at 11:04 PM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> > > > > Hey, thanks for these links, very helpful.
> > > > > -sk
> >
> > > > > On Dec 8, 7:49 pm, "L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > > > > > Hi,
> >
> > > > > >       For this you need to use rjs Ajax request.
Please refer the
> > > > > > following links, you will get an idea.
> >
> > > > > >
1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
> > > > > > 2.
> >
>http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
> >
> > > > one more option is to keep @mapped_sites to a javascript
variable so
> you
> > > > dont have to use ajax.  you might also want to move the
makeMarker
> part
> > > > to a js function to tidy up the view and just call that
function
> when you
> > > > need
> > > > to update the colors
> >
> > > > something along the lines of
> >
> > > > var sites = <%= @mapped_sites.to_json %>;
> > > > addCircles(sites);
> >
> > > > function addCircles(circles) {
> > > >   for(i=0; i<circles.length; i++) {
> > > >     center = new google.maps.LatLng(circles[i][0],
circles[i][1]);
> > > >     siteCircle = makeMarker({
> > > >       position: center,
> > > >       strokeColor: "#FF0000",
> > > >       strokeOpacity: 0.8,
> > > >       strokeWeight: 2,
> > > >       fillColor: circles[i][7],
> > > >       fillOpacity: 0.75,
> > > >       radius: 560,
> > > >       map: map,
> > > >       center: center,
> > > >       radius: circles[i][2],
> > > >       title: circles[i][5],
> > > >       content: ''content''
> > > >     });
> > > >   }
> >
> > > > }
> >
> > > > then you just need to update the sites variable using js. no
need
> > > > to go back to the server.
> >
> > > > > > On Thu, Dec 8, 2011 at 1:10 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >
> > > > > > > Hey all,
> > > > > > > i have a google map and i am drawing circles
on the map like
> this..
> >
> > > > > > >  var latlng = new
google.maps.LatLng(35.931387,
> > > > > > > -102.31062);
> > > > > > >    var myMapOptions > > > > >
> > {
> > > > > > >      zoom:
> > > > > > > 12,
> > > > > > >      center:
> > > > > > > latlng,
> > > > > > >      mapTypeId:
> > > > > > > google.maps.MapTypeId.HYBRID
> > > > > > >    };
> >
> > > > > > >    var map = new
> > > > > > >
google.maps.Map(document.getElementById("map_canvas"),
> > > > > > > myMapOptions);
> > > > > > >    var infoWindow = new
> > > > > > > google.maps.InfoWindow();
> > > > > > >    var markerBounds = new
> > > > > > > google.maps.LatLngBounds();
> >
> > > > > > >   <% @mapped_sites.each do |row|
> > > > > > > %>
> >
> > > > > > >        // main
> > > > > > > circle
> > > > > > >        center = new google.maps.LatLng(<%=
"#{row[0]}" %>, <%> > > > > > >
"#{row[1]}"
> > > > > > > %>);
> > > > > > >        siteCircle > > > > >
> > makeMarker({
> > > > > > >          position:
> > > > > > > center,
> > > > > > >          strokeColor:
> > > > > > > "#FF0000",
> > > > > > >          strokeOpacity:
> > > > > > > 0.8,
> > > > > > >          strokeWeight:
> > > > > > > 2,
> > > > > > >          fillColor: ''<%=
"#{row[7]}"
> > > > > > > %>'',
> > > > > > >          fillOpacity:
> > > > > > > 0.75,
> > > > > > >          radius:
> > > > > > > 560,
> > > > > > >          map:
> > > > > > > map,
> > > > > > >          center:
> > > > > > > center,
> > > > > > >          radius: <%= "#{row[2]}"
> > > > > > > %>,
> > > > > > >          title: ''<%=
"#{row[5]}"
> > > > > > > %>'',
> > > > > > >          content: ''<%= "some
contnet
> > > > > > > %>''
> > > > > > >       });
> >
> > > > > > >       markerArray.push(siteCircle);
> >
> > > > > > > my question is, that since the fillColor is
going to change
> from
> > > time
> > > > > > > to time, i want to update all the colors of
the circles
> > > periodically.
> > > > > > > What i don''t know how to do is get
the equivelent to the
> > > > > > > @mapped_sites  because if i could, i think i
could just delete
> the
> > > > > > > existing circles and draw new ones.
> >
> > > > > > > How do i get info back from the server
periodically to update
> the
> > > > > > > circle colors?
> >
> > > > > > > thanks to all.
> > > > > > > skrite
> >
> > > > > > > --
> > > > > > > You received this message because you are
subscribed to the
> Google
> > > > > Groups "Ruby on Rails: Talk" group.
> > > > > > > To post to this group, send email to
> > > rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> > > > > .
> > > > > > > To unsubscribe from this group, send email to
> > > > >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > > > > > For more options, visit this group athttp://
> > > > > groups.google.com/group/rubyonrails-talk?hl=en.
> >
> > > > > > --
> >
> > > > > > Regards,
> > > > > > L.KarthiKeyan.
> >
> > > > > --
> > > > > You received this message because you are subscribed to
the Google
> > > Groups
> > > > > "Ruby on Rails: Talk" group.
> > > > > To post to this group, send email to
> rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> > > .
> > > > > To unsubscribe from this group, send email to
> > > > >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > > > For more options, visit this group at
> > > > >http://groups.google.com/group/rubyonrails-talk?hl=en.
> >
> > > > --
> > > >
-------------------------------------------------------------
> > > > visit my blog athttp://jimlabs.heroku.com
> >
> > > --
> > > You received this message because you are subscribed to the
Google
> Groups
> > > "Ruby on Rails: Talk" group.
> > > To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> .
> > > To unsubscribe from this group, send email to
> > >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > For more options, visit this group at
> > >http://groups.google.com/group/rubyonrails-talk?hl=en.
> >
> > --
> > -------------------------------------------------------------
> > visit my blog athttp://jimlabs.heroku.com
>
> --
> You received this message because you are subscribed to the Google Groups
> "Ruby on Rails: Talk" group.
> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> To unsubscribe from this group, send email to
>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> For more options, visit this group at
> http://groups.google.com/group/rubyonrails-talk?hl=en.
>
>

-- 
-------------------------------------------------------------
visit my blog at http://jimlabs.heroku.com

-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

skrite

2011-Dec-13 19:54 UTC

head link

Re: how to use javascript to update markers on Google maps

Jim.

You are correct, when i show typeof(sites) from when sites = <%@mapped_sites
=>
i get object
when i do typeof(sites) after getting sites from the
url_that_returns_json
i get string

i suppose that i am not getting returned correctly.
if i look at the source of @mapped_sites
and from the browser look at url_that_returns_json,
they are identical.

thanks for your help, again.
I have learned a lot the last couple of days :)

On Dec 12, 6:22 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> On Tue, Dec 13, 2011 at 6:08 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> > I am doing something similar here. The website is built on rails 2.3.9
> > and
> > uses prototype.
>
> > Almost all of what i need to happen does, but i get to the point where
> > the update happens and nothing does.
>
> > // add circles to map as it initializes
> >    addCircles(sites, map, markerArray, lineArray);
>
> >    var pe = new
PeriodicalExecuter(refreshCircleMarkers.curry(markerArray,
> > lineArray, map), 33);
>
> > function refreshCircleMarkers(markerArray, lineArray, map) {
> >   // first we remove the existing markers in place
> >   for(i=0; i<markerArray.length; i++) {
> >     markerArray[i].setMap(null);
> >   }
>
>   // and empty the array itself>   markerArray = [];
>
> >   var url = "/group/update_mapv3_circles";
> >   new Ajax.Request(url, {
> >     method: ''get'',
> >     onSuccess: function(response) {
> >       var sites = response.responseText;
> >       addCircles(sites, map, markerArray, lineArray);
> >     }
> >   });
>
> I see nothing wrong. Does the addCircles function expect a JSON
> object for the first param?  The only reason I can think why this
isn''t
> working
> is a type mismatch.
>
>
>
>
>
>
>
>
>
>
>
> > If i do an alert(response.responseText) the alert will show up and
> > display the contents of the @mapped_sites.to_json ( i am using
> > render :json => @mapped_sites.to_json in the controller).
> > Please let me know if you see something i am doing wrong.
> > Thanks for your help on this so far Jim.
>
> > sk
>
> > On Dec 9, 11:49 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > > On Sat, Dec 10, 2011 at 3:56 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> > > > I am intrigued by this solution, Jim.
> > > > i have a couple of questions, as it seems this is a cleaner
way than
> > > > what I am trying to do.
> > > > The values that determine the circle color are in the
database, and
> > > > can change while the page is loaded. This is why i need them
to
> > > > update.
>
> > > i''ll still go with my suggestion earlier.  To update the
colors, just
> > update
> > > the sites variable after completing the ajax request and then
call
> > > addCircles
>
> > > your ajax call may look like the following (this is totally
untested :D)
>
> > > $.ajax({
> > >   url:
your_url_here_that_returns_json_equivalent_of_@mapped_sites,
> > >   success: function(data) {
> > >     addCircles(data);
> > >   }
>
> > > });
> > > > So, somehow i still need to go to the server for that. I
guess i am
> > > > missing the part about how to get the @mapped_sites variable
to the
> > > > controller and back again to the page to rebuild the
circles.
> > > > Thanks for your time on this.
> > > > sk
>
> > > > On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > > > > On Fri, Dec 9, 2011 at 11:04 PM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> > > > > > Hey, thanks for these links, very helpful.
> > > > > > -sk
>
> > > > > > On Dec 8, 7:49 pm, "L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > > > > > > Hi,
>
> > > > > > >       For this you need to use rjs Ajax
request. Please refer the
> > > > > > > following links, you will get an idea.
>
> > > > > > >
1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
> > > > > > > 2.
> > >
>http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
>
> > > > > one more option is to keep @mapped_sites to a
javascript variable so
> > you
> > > > > dont have to use ajax.  you might also want to move the
makeMarker
> > part
> > > > > to a js function to tidy up the view and just call that
function
> > when you
> > > > > need
> > > > > to update the colors
>
> > > > > something along the lines of
>
> > > > > var sites = <%= @mapped_sites.to_json %>;
> > > > > addCircles(sites);
>
> > > > > function addCircles(circles) {
> > > > >   for(i=0; i<circles.length; i++) {
> > > > >     center = new google.maps.LatLng(circles[i][0],
circles[i][1]);
> > > > >     siteCircle = makeMarker({
> > > > >       position: center,
> > > > >       strokeColor: "#FF0000",
> > > > >       strokeOpacity: 0.8,
> > > > >       strokeWeight: 2,
> > > > >       fillColor: circles[i][7],
> > > > >       fillOpacity: 0.75,
> > > > >       radius: 560,
> > > > >       map: map,
> > > > >       center: center,
> > > > >       radius: circles[i][2],
> > > > >       title: circles[i][5],
> > > > >       content: ''content''
> > > > >     });
> > > > >   }
>
> > > > > }
>
> > > > > then you just need to update the sites variable using
js. no need
> > > > > to go back to the server.
>
> > > > > > > On Thu, Dec 8, 2011 at 1:10 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> > > > > > > > Hey all,
> > > > > > > > i have a google map and i am drawing
circles on the map like
> > this..
>
> > > > > > > >  var latlng = new
google.maps.LatLng(35.931387,
> > > > > > > > -102.31062);
> > > > > > > >    var myMapOptions > > > >
> > > > {
> > > > > > > >      zoom:
> > > > > > > > 12,
> > > > > > > >      center:
> > > > > > > > latlng,
> > > > > > > >      mapTypeId:
> > > > > > > > google.maps.MapTypeId.HYBRID
> > > > > > > >    };
>
> > > > > > > >    var map = new
> > > > > > > >
google.maps.Map(document.getElementById("map_canvas"),
> > > > > > > > myMapOptions);
> > > > > > > >    var infoWindow = new
> > > > > > > > google.maps.InfoWindow();
> > > > > > > >    var markerBounds = new
> > > > > > > > google.maps.LatLngBounds();
>
> > > > > > > >   <% @mapped_sites.each do |row|
> > > > > > > > %>
>
> > > > > > > >        // main
> > > > > > > > circle
> > > > > > > >        center = new
google.maps.LatLng(<%= "#{row[0]}" %>, <%> > > >
> > > > "#{row[1]}"
> > > > > > > > %>);
> > > > > > > >        siteCircle > > > >
> > > > makeMarker({
> > > > > > > >          position:
> > > > > > > > center,
> > > > > > > >          strokeColor:
> > > > > > > > "#FF0000",
> > > > > > > >          strokeOpacity:
> > > > > > > > 0.8,
> > > > > > > >          strokeWeight:
> > > > > > > > 2,
> > > > > > > >          fillColor: ''<%=
"#{row[7]}"
> > > > > > > > %>'',
> > > > > > > >          fillOpacity:
> > > > > > > > 0.75,
> > > > > > > >          radius:
> > > > > > > > 560,
> > > > > > > >          map:
> > > > > > > > map,
> > > > > > > >          center:
> > > > > > > > center,
> > > > > > > >          radius: <%=
"#{row[2]}"
> > > > > > > > %>,
> > > > > > > >          title: ''<%=
"#{row[5]}"
> > > > > > > > %>'',
> > > > > > > >          content: ''<%=
"some contnet
> > > > > > > > %>''
> > > > > > > >       });
>
> > > > > > > >       markerArray.push(siteCircle);
>
> > > > > > > > my question is, that since the fillColor
is going to change
> > from
> > > > time
> > > > > > > > to time, i want to update all the colors
of the circles
> > > > periodically.
> > > > > > > > What i don''t know how to do is
get the equivelent to the
> > > > > > > > @mapped_sites  because if i could, i
think i could just delete
> > the
> > > > > > > > existing circles and draw new ones.
>
> > > > > > > > How do i get info back from the server
periodically to update
> > the
> > > > > > > > circle colors?
>
> > > > > > > > thanks to all.
> > > > > > > > skrite
>
> > > > > > > > --
> > > > > > > > You received this message because you
are subscribed to the
> > Google
> > > > > > Groups "Ruby on Rails: Talk" group.
> > > > > > > > To post to this group, send email to
> > > > rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> > > > > > .
> > > > > > > > To unsubscribe from this group, send
email to
> > > > > >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > > > > > > For more options, visit this group
athttp://
> > > > > > groups.google.com/group/rubyonrails-talk?hl=en.
>
> > > > > > > --
>
> > > > > > > Regards,
> > > > > > > L.KarthiKeyan.
>
> > > > > > --
> > > > > > You received this message because you are
subscribed to the Google
> > > > Groups
> > > > > > "Ruby on Rails: Talk" group.
> > > > > > To post to this group, send email to
> > rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> > > > .
> > > > > > To unsubscribe from this group, send email to
> > > > > >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > > > > For more options, visit this group at
> > > > >
>http://groups.google.com/group/rubyonrails-talk?hl=en.
>
> > > > > --
> > > > >
-------------------------------------------------------------
> > > > > visit my blog athttp://jimlabs.heroku.com
>
> > > > --
> > > > You received this message because you are subscribed to the
Google
> > Groups
> > > > "Ruby on Rails: Talk" group.
> > > > To post to this group, send email to
rubyonrails-talk@googlegroups.com
> > .
> > > > To unsubscribe from this group, send email to
> > > >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > > > For more options, visit this group at
> > > >http://groups.google.com/group/rubyonrails-talk?hl=en.
>
> > > --
> > > -------------------------------------------------------------
> > > visit my blog athttp://jimlabs.heroku.com
>
> > --
> > You received this message because you are subscribed to the Google
Groups
> > "Ruby on Rails: Talk" group.
> > To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > To unsubscribe from this group, send email to
> >
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > For more options, visit this group at
> >http://groups.google.com/group/rubyonrails-talk?hl=en.
>
> --
> -------------------------------------------------------------
> visit my blog athttp://jimlabs.heroku.com
-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

Frederick Cheung

2011-Dec-13 22:08 UTC

head link

Re: Re: how to use javascript to update markers on Google maps

On 13 Dec 2011, at 19:54, skrite
<shawn-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> Jim.
> 
> You are correct, when i show typeof(sites) from when sites = <%>
@mapped_sites =>
> i get object
> when i do typeof(sites) after getting sites from the
> url_that_returns_json
> i get string
> 
responseText is always going to be text if I remember how prototype handles
thing (the text will just happen to be the string representation of the json).
If the response content-type was set correctly then response.responseJson (or
something like that) should be populated

Fred> i suppose that i am not getting returned correctly.
> if i look at the source of @mapped_sites
> and from the browser look at url_that_returns_json,
> they are identical.
> 
> thanks for your help, again.
> I have learned a lot the last couple of days :)
> 
> On Dec 12, 6:22 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>> On Tue, Dec 13, 2011 at 6:08 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>>> I am doing something similar here. The website is built on rails
2.3.9
>>> and
>>> uses prototype.
>> 
>>> Almost all of what i need to happen does, but i get to the point
where
>>> the update happens and nothing does.
>> 
>>> // add circles to map as it initializes
>>>    addCircles(sites, map, markerArray, lineArray);
>> 
>>>    var pe = new
PeriodicalExecuter(refreshCircleMarkers.curry(markerArray,
>>> lineArray, map), 33);
>> 
>>> function refreshCircleMarkers(markerArray, lineArray, map) {
>>>   // first we remove the existing markers in place
>>>   for(i=0; i<markerArray.length; i++) {
>>>     markerArray[i].setMap(null);
>>>   }
>> 
>>   // and empty the array itself>   markerArray = [];
>> 
>>>   var url = "/group/update_mapv3_circles";
>>>   new Ajax.Request(url, {
>>>     method: ''get'',
>>>     onSuccess: function(response) {
>>>       var sites = response.responseText;
>>>       addCircles(sites, map, markerArray, lineArray);
>>>     }
>>>   });
>> 
>> I see nothing wrong. Does the addCircles function expect a JSON
>> object for the first param?  The only reason I can think why this
isn''t
>> working
>> is a type mismatch.
>> 
>> 
>> 
>> 
>> 
>> 
>> 
>> 
>> 
>> 
>> 
>>> If i do an alert(response.responseText) the alert will show up and
>>> display the contents of the @mapped_sites.to_json ( i am using
>>> render :json => @mapped_sites.to_json in the controller).
>>> Please let me know if you see something i am doing wrong.
>>> Thanks for your help on this so far Jim.
>> 
>>> sk
>> 
>>> On Dec 9, 11:49 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>> On Sat, Dec 10, 2011 at 3:56 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>>>>> I am intrigued by this solution, Jim.
>>>>> i have a couple of questions, as it seems this is a cleaner
way than
>>>>> what I am trying to do.
>>>>> The values that determine the circle color are in the
database, and
>>>>> can change while the page is loaded. This is why i need
them to
>>>>> update.
>> 
>>>> i''ll still go with my suggestion earlier.  To update
the colors, just
>>> update
>>>> the sites variable after completing the ajax request and then
call
>>>> addCircles
>> 
>>>> your ajax call may look like the following (this is totally
untested :D)
>> 
>>>> $.ajax({
>>>>   url:
your_url_here_that_returns_json_equivalent_of_@mapped_sites,
>>>>   success: function(data) {
>>>>     addCircles(data);
>>>>   }
>> 
>>>> });
>>>>> So, somehow i still need to go to the server for that. I
guess i am
>>>>> missing the part about how to get the @mapped_sites
variable to the
>>>>> controller and back again to the page to rebuild the
circles.
>>>>> Thanks for your time on this.
>>>>> sk
>> 
>>>>> On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>>>> On Fri, Dec 9, 2011 at 11:04 PM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>>>>>>> Hey, thanks for these links, very helpful.
>>>>>>> -sk
>> 
>>>>>>> On Dec 8, 7:49 pm, "L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>>>>>> Hi,
>> 
>>>>>>>>       For this you need to use rjs Ajax
request. Please refer the
>>>>>>>> following links, you will get an idea.
>> 
>>>>>>>>
1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
>>>>>>>> 2.
>>>>>
http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
>> 
>>>>>> one more option is to keep @mapped_sites to a
javascript variable so
>>> you
>>>>>> dont have to use ajax.  you might also want to move the
makeMarker
>>> part
>>>>>> to a js function to tidy up the view and just call that
function
>>> when you
>>>>>> need
>>>>>> to update the colors
>> 
>>>>>> something along the lines of
>> 
>>>>>> var sites = <%= @mapped_sites.to_json %>;
>>>>>> addCircles(sites);
>> 
>>>>>> function addCircles(circles) {
>>>>>>   for(i=0; i<circles.length; i++) {
>>>>>>     center = new google.maps.LatLng(circles[i][0],
circles[i][1]);
>>>>>>     siteCircle = makeMarker({
>>>>>>       position: center,
>>>>>>       strokeColor: "#FF0000",
>>>>>>       strokeOpacity: 0.8,
>>>>>>       strokeWeight: 2,
>>>>>>       fillColor: circles[i][7],
>>>>>>       fillOpacity: 0.75,
>>>>>>       radius: 560,
>>>>>>       map: map,
>>>>>>       center: center,
>>>>>>       radius: circles[i][2],
>>>>>>       title: circles[i][5],
>>>>>>       content: ''content''
>>>>>>     });
>>>>>>   }
>> 
>>>>>> }
>> 
>>>>>> then you just need to update the sites variable using
js. no need
>>>>>> to go back to the server.
>> 
>>>>>>>> On Thu, Dec 8, 2011 at 1:10 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>> 
>>>>>>>>> Hey all,
>>>>>>>>> i have a google map and i am drawing
circles on the map like
>>> this..
>> 
>>>>>>>>>  var latlng = new
google.maps.LatLng(35.931387,
>>>>>>>>> -102.31062);
>>>>>>>>>    var myMapOptions
>>>>>>>>> {
>>>>>>>>>      zoom:
>>>>>>>>> 12,
>>>>>>>>>      center:
>>>>>>>>> latlng,
>>>>>>>>>      mapTypeId:
>>>>>>>>> google.maps.MapTypeId.HYBRID
>>>>>>>>>    };
>> 
>>>>>>>>>    var map = new
>>>>>>>>>
google.maps.Map(document.getElementById("map_canvas"),
>>>>>>>>> myMapOptions);
>>>>>>>>>    var infoWindow = new
>>>>>>>>> google.maps.InfoWindow();
>>>>>>>>>    var markerBounds = new
>>>>>>>>> google.maps.LatLngBounds();
>> 
>>>>>>>>>   <% @mapped_sites.each do |row|
>>>>>>>>> %>
>> 
>>>>>>>>>        // main
>>>>>>>>> circle
>>>>>>>>>        center = new
google.maps.LatLng(<%= "#{row[0]}" %>,
<%>>>>>>>>> "#{row[1]}"
>>>>>>>>> %>);
>>>>>>>>>        siteCircle
>>>>>>>>> makeMarker({
>>>>>>>>>          position:
>>>>>>>>> center,
>>>>>>>>>          strokeColor:
>>>>>>>>> "#FF0000",
>>>>>>>>>          strokeOpacity:
>>>>>>>>> 0.8,
>>>>>>>>>          strokeWeight:
>>>>>>>>> 2,
>>>>>>>>>          fillColor: ''<%=
"#{row[7]}"
>>>>>>>>> %>'',
>>>>>>>>>          fillOpacity:
>>>>>>>>> 0.75,
>>>>>>>>>          radius:
>>>>>>>>> 560,
>>>>>>>>>          map:
>>>>>>>>> map,
>>>>>>>>>          center:
>>>>>>>>> center,
>>>>>>>>>          radius: <%=
"#{row[2]}"
>>>>>>>>> %>,
>>>>>>>>>          title: ''<%=
"#{row[5]}"
>>>>>>>>> %>'',
>>>>>>>>>          content: ''<%=
"some contnet
>>>>>>>>> %>''
>>>>>>>>>       });
>> 
>>>>>>>>>       markerArray.push(siteCircle);
>> 
>>>>>>>>> my question is, that since the fillColor is
going to change
>>> from
>>>>> time
>>>>>>>>> to time, i want to update all the colors of
the circles
>>>>> periodically.
>>>>>>>>> What i don''t know how to do is get
the equivelent to the
>>>>>>>>> @mapped_sites  because if i could, i think
i could just delete
>>> the
>>>>>>>>> existing circles and draw new ones.
>> 
>>>>>>>>> How do i get info back from the server
periodically to update
>>> the
>>>>>>>>> circle colors?
>> 
>>>>>>>>> thanks to all.
>>>>>>>>> skrite
>> 
>>>>>>>>> --
>>>>>>>>> You received this message because you are
subscribed to the
>>> Google
>>>>>>> Groups "Ruby on Rails: Talk" group.
>>>>>>>>> To post to this group, send email to
>>>>> rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
>>>>>>> .
>>>>>>>>> To unsubscribe from this group, send email
to
>>>>>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
>>>>>>>>> For more options, visit this group
athttp://
>>>>>>> groups.google.com/group/rubyonrails-talk?hl=en.
>> 
>>>>>>>> --
>> 
>>>>>>>> Regards,
>>>>>>>> L.KarthiKeyan.
>> 
>>>>>>> --
>>>>>>> You received this message because you are
subscribed to the Google
>>>>> Groups
>>>>>>> "Ruby on Rails: Talk" group.
>>>>>>> To post to this group, send email to
>>> rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
>>>>> .
>>>>>>> To unsubscribe from this group, send email to
>>>>>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
>>>>>>> For more options, visit this group at
>>>>>>>
http://groups.google.com/group/rubyonrails-talk?hl=en.
>> 
>>>>>> --
>>>>>>
-------------------------------------------------------------
>>>>>> visit my blog athttp://jimlabs.heroku.com
>> 
>>>>> --
>>>>> You received this message because you are subscribed to the
Google
>>> Groups
>>>>> "Ruby on Rails: Talk" group.
>>>>> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
>>> .
>>>>> To unsubscribe from this group, send email to
>>>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
>>>>> For more options, visit this group at
>>>>> http://groups.google.com/group/rubyonrails-talk?hl=en.
>> 
>>>> --
>>>> -------------------------------------------------------------
>>>> visit my blog athttp://jimlabs.heroku.com
>> 
>>> --
>>> You received this message because you are subscribed to the Google
Groups
>>> "Ruby on Rails: Talk" group.
>>> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
>>> To unsubscribe from this group, send email to
>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
>>> For more options, visit this group at
>>> http://groups.google.com/group/rubyonrails-talk?hl=en.
>> 
>> --
>> -------------------------------------------------------------
>> visit my blog athttp://jimlabs.heroku.com
> 
> -- 
> You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.
> 
-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

skrite

2011-Dec-14 05:47 UTC

head link

Re: how to use javascript to update markers on Google maps

ok, even though the @mapped_sites.to_json works, the output of that
does not look like json. It looks like an array

example:

var sites =
[["35.931341","-102.32205",381.75,288.0,"AL","AL",
557,"#7F7F7F","#FF0000",287.1,288.3,"AL<br>0
psi",0],
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
34280,"#7F7F7F","#FF0000",83.1,83.3,"DC<br>0
psi",0],
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
["35.92361","-102.308768",534.75,73.7,"J1","J1",
559,"#7F7F7F","#FF0000",74.7,73.8,"J1<br>0
psi",0],
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
397.5,80.8,"SL1","SL1",561,"#7F7F7F","#FF0000",81.3,81.9,"SL1<br>0
psi",0],["35.931186","-102.304202",390.0,165.2,"SL2","SL2",
110823130,"#7F7F7F","#FF0000",165.4,165.6,"SL2<br>0
psi",0],
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
["35.931301","-102.29965",397.5,23.7,"SL5","SL5",
564,"#7F7F7F","#FF0000",23.9,23.0,"SL5<br>0
psi",0],
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]];

and the code seems to work with it like an array. How do i get the
responseText from the server as an array?

thanks again.

sk

On Dec 13, 4:08 pm, Frederick Cheung
<frederick.che...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> On 13 Dec 2011, at 19:54, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> > Jim.
>
> > You are correct, when i show typeof(sites) from when sites = <%>
> @mapped_sites =>
> > i get object
> > when i do typeof(sites) after getting sites from the
> > url_that_returns_json
> > i get string
>
> responseText is always going to be text if I remember how prototype handles
thing (the text will just happen to be the string representation of the json).
> If the response content-type was set correctly then response.responseJson
(or something like that) should be populated
>
> Fred
>
>
>
>
>
>
>
> > i suppose that i am not getting returned correctly.
> > if i look at the source of @mapped_sites
> > and from the browser look at url_that_returns_json,
> > they are identical.
>
> > thanks for your help, again.
> > I have learned a lot the last couple of days :)
>
> > On Dec 12, 6:22 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >> On Tue, Dec 13, 2011 at 6:08 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >>> I am doing something similar here. The website is built on
rails 2.3.9
> >>> and
> >>> uses prototype.
>
> >>> Almost all of what i need to happen does, but i get to the
point where
> >>> the update happens and nothing does.
>
> >>> // add circles to map as it initializes
> >>>    addCircles(sites, map, markerArray, lineArray);
>
> >>>    var pe = new
PeriodicalExecuter(refreshCircleMarkers.curry(markerArray,
> >>> lineArray, map), 33);
>
> >>> function refreshCircleMarkers(markerArray, lineArray, map) {
> >>>   // first we remove the existing markers in place
> >>>   for(i=0; i<markerArray.length; i++) {
> >>>     markerArray[i].setMap(null);
> >>>   }
>
> >>   // and empty the array itself>   markerArray = [];
>
> >>>   var url = "/group/update_mapv3_circles";
> >>>   new Ajax.Request(url, {
> >>>     method: ''get'',
> >>>     onSuccess: function(response) {
> >>>       var sites = response.responseText;
> >>>       addCircles(sites, map, markerArray, lineArray);
> >>>     }
> >>>   });
>
> >> I see nothing wrong. Does the addCircles function expect a JSON
> >> object for the first param?  The only reason I can think why this
isn''t
> >> working
> >> is a type mismatch.
>
> >>> If i do an alert(response.responseText) the alert will show up
and
> >>> display the contents of the @mapped_sites.to_json ( i am using
> >>> render :json => @mapped_sites.to_json in the controller).
> >>> Please let me know if you see something i am doing wrong.
> >>> Thanks for your help on this so far Jim.
>
> >>> sk
>
> >>> On Dec 9, 11:49 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>> On Sat, Dec 10, 2011 at 3:56 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >>>>> I am intrigued by this solution, Jim.
> >>>>> i have a couple of questions, as it seems this is a
cleaner way than
> >>>>> what I am trying to do.
> >>>>> The values that determine the circle color are in the
database, and
> >>>>> can change while the page is loaded. This is why i
need them to
> >>>>> update.
>
> >>>> i''ll still go with my suggestion earlier.  To
update the colors, just
> >>> update
> >>>> the sites variable after completing the ajax request and
then call
> >>>> addCircles
>
> >>>> your ajax call may look like the following (this is
totally untested :D)
>
> >>>> $.ajax({
> >>>>   url:
your_url_here_that_returns_json_equivalent_of_@mapped_sites,
> >>>>   success: function(data) {
> >>>>     addCircles(data);
> >>>>   }
>
> >>>> });
> >>>>> So, somehow i still need to go to the server for that.
I guess i am
> >>>>> missing the part about how to get the @mapped_sites
variable to the
> >>>>> controller and back again to the page to rebuild the
circles.
> >>>>> Thanks for your time on this.
> >>>>> sk
>
> >>>>> On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>>>> On Fri, Dec 9, 2011 at 11:04 PM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >>>>>>> Hey, thanks for these links, very helpful.
> >>>>>>> -sk
>
> >>>>>>> On Dec 8, 7:49 pm, "L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>>>>>> Hi,
>
> >>>>>>>>       For this you need to use rjs Ajax
request. Please refer the
> >>>>>>>> following links, you will get an idea.
>
> >>>>>>>>
1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
> >>>>>>>> 2.
>
>>>>>http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
>
> >>>>>> one more option is to keep @mapped_sites to a
javascript variable so
> >>> you
> >>>>>> dont have to use ajax.  you might also want to
move the makeMarker
> >>> part
> >>>>>> to a js function to tidy up the view and just call
that function
> >>> when you
> >>>>>> need
> >>>>>> to update the colors
>
> >>>>>> something along the lines of
>
> >>>>>> var sites = <%= @mapped_sites.to_json %>;
> >>>>>> addCircles(sites);
>
> >>>>>> function addCircles(circles) {
> >>>>>>   for(i=0; i<circles.length; i++) {
> >>>>>>     center = new google.maps.LatLng(circles[i][0],
circles[i][1]);
> >>>>>>     siteCircle = makeMarker({
> >>>>>>       position: center,
> >>>>>>       strokeColor: "#FF0000",
> >>>>>>       strokeOpacity: 0.8,
> >>>>>>       strokeWeight: 2,
> >>>>>>       fillColor: circles[i][7],
> >>>>>>       fillOpacity: 0.75,
> >>>>>>       radius: 560,
> >>>>>>       map: map,
> >>>>>>       center: center,
> >>>>>>       radius: circles[i][2],
> >>>>>>       title: circles[i][5],
> >>>>>>       content: ''content''
> >>>>>>     });
> >>>>>>   }
>
> >>>>>> }
>
> >>>>>> then you just need to update the sites variable
using js. no need
> >>>>>> to go back to the server.
>
> >>>>>>>> On Thu, Dec 8, 2011 at 1:10 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> >>>>>>>>> Hey all,
> >>>>>>>>> i have a google map and i am drawing
circles on the map like
> >>> this..
>
> >>>>>>>>>  var latlng = new
google.maps.LatLng(35.931387,
> >>>>>>>>> -102.31062);
> >>>>>>>>>    var myMapOptions >
>>>>>>>>> {
> >>>>>>>>>      zoom:
> >>>>>>>>> 12,
> >>>>>>>>>      center:
> >>>>>>>>> latlng,
> >>>>>>>>>      mapTypeId:
> >>>>>>>>> google.maps.MapTypeId.HYBRID
> >>>>>>>>>    };
>
> >>>>>>>>>    var map = new
> >>>>>>>>>
google.maps.Map(document.getElementById("map_canvas"),
> >>>>>>>>> myMapOptions);
> >>>>>>>>>    var infoWindow = new
> >>>>>>>>> google.maps.InfoWindow();
> >>>>>>>>>    var markerBounds = new
> >>>>>>>>> google.maps.LatLngBounds();
>
> >>>>>>>>>   <% @mapped_sites.each do |row|
> >>>>>>>>> %>
>
> >>>>>>>>>        // main
> >>>>>>>>> circle
> >>>>>>>>>        center = new
google.maps.LatLng(<%= "#{row[0]}" %>, <%>
>>>>>>>>> "#{row[1]}"
> >>>>>>>>> %>);
> >>>>>>>>>        siteCircle >
>>>>>>>>> makeMarker({
> >>>>>>>>>          position:
> >>>>>>>>> center,
> >>>>>>>>>          strokeColor:
> >>>>>>>>> "#FF0000",
> >>>>>>>>>          strokeOpacity:
> >>>>>>>>> 0.8,
> >>>>>>>>>          strokeWeight:
> >>>>>>>>> 2,
> >>>>>>>>>          fillColor: ''<%=
"#{row[7]}"
> >>>>>>>>> %>'',
> >>>>>>>>>          fillOpacity:
> >>>>>>>>> 0.75,
> >>>>>>>>>          radius:
> >>>>>>>>> 560,
> >>>>>>>>>          map:
> >>>>>>>>> map,
> >>>>>>>>>          center:
> >>>>>>>>> center,
> >>>>>>>>>          radius: <%=
"#{row[2]}"
> >>>>>>>>> %>,
> >>>>>>>>>          title: ''<%=
"#{row[5]}"
> >>>>>>>>> %>'',
> >>>>>>>>>          content: ''<%=
"some contnet
> >>>>>>>>> %>''
> >>>>>>>>>       });
>
> >>>>>>>>>       markerArray.push(siteCircle);
>
> >>>>>>>>> my question is, that since the
fillColor is going to change
> >>> from
> >>>>> time
> >>>>>>>>> to time, i want to update all the
colors of the circles
> >>>>> periodically.
> >>>>>>>>> What i don''t know how to do
is get the equivelent to the
> >>>>>>>>> @mapped_sites  because if i could, i
think i could just delete
> >>> the
> >>>>>>>>> existing circles and draw new ones.
>
> >>>>>>>>> How do i get info back from the server
periodically to update
> >>> the
> >>>>>>>>> circle colors?
>
> >>>>>>>>> thanks to all.
> >>>>>>>>> skrite
>
> >>>>>>>>> --
> >>>>>>>>> You received this message because you
are subscribed to the
> >>> Google
> >>>>>>> Groups "Ruby on Rails: Talk" group.
> >>>>>>>>> To post to this group, send email to
> >>>>>
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> >>>>>>> .
> >>>>>>>>> To unsubscribe from this group, send
email to
> >>>>>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> >>>>>>>>> For more options, visit this group
athttp://
> >>>>>>>
groups.google.com/group/rubyonrails-talk?hl=en.
>
> >>>>>>>> --
>
> >>>>>>>> Regards,
> >>>>>>>> L.KarthiKeyan.
>
> >>>>>>> --
> >>>>>>> You received this message because you are
subscribed to the Google
> >>>>> Groups
> >>>>>>> "Ruby on Rails: Talk" group.
> >>>>>>> To post to this group, send email to
> >>> rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
> >>>>> .
> >>>>>>> To unsubscribe from this group, send email to
> >>>>>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> >>>>>>> For more options, visit this group at
>
>>>>>>>http://groups.google.com/group/rubyonrails-talk?hl=en.
>
> >>>>>> --
> >>>>>>
-------------------------------------------------------------
> >>>>>> visit my blog athttp://jimlabs.heroku.com
>
> >>>>> --
> >>>>> You received this message because you are subscribed
to the Google
> >>> Groups
> >>>>> "Ruby on Rails: Talk" group.
> >>>>> To post to this group, send email to
rubyonrails-talk@googlegroups.com
> >>> .
> >>>>> To unsubscribe from this group, send email to
> >>>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> >>>>> For more options, visit this group at
> >>>>>http://groups.google.com/group/rubyonrails-talk?hl=en.
>
> >>>> --
> >>>>
-------------------------------------------------------------
> >>>> visit my blog athttp://jimlabs.heroku.com
>
> >>> --
> >>> You received this message because you are subscribed to the
Google Groups
> >>> "Ruby on Rails: Talk" group.
> >>> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh4Ykp1iOSErHA@public.gmane.orgm.
> >>> To unsubscribe from this group, send email to
> >>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> >>> For more options, visit this group at
> >>>http://groups.google.com/group/rubyonrails-talk?hl=en.
>
> >> --
> >> -------------------------------------------------------------
> >> visit my blog athttp://jimlabs.heroku.com
>
> > --
> > You received this message because you are subscribed to the Google
Groups "Ruby on Rails: Talk" group.
> > To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> > To unsubscribe from this group, send email to
>
> ...
>
> read more »
-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

Frederick Cheung

2011-Dec-14 08:52 UTC

head link

Re: Re: how to use javascript to update markers on Google maps

On 14 Dec 2011, at 05:47, skrite
<shawn-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> ok, even though the @mapped_sites.to_json works, the output of that
> does not look like json. It looks like an array
> 
If my memory is correct, that''s valid json too ( as are most literals).
It''s common for the top level thing to be an object rather than an
array, but not mandatory. Since the thing you called to_json on was an array,
you got the json representation of an array back.

To get the non text version of the response, like I said earlier look at
response.responseJSON

Fred

> example:
> 
> var sites =
[["35.931341","-102.32205",381.75,288.0,"AL","AL",
> 557,"#7F7F7F","#FF0000",287.1,288.3,"AL<br>0
psi",0],
>
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
> 34280,"#7F7F7F","#FF0000",83.1,83.3,"DC<br>0
psi",0],
>
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
>
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
>
["35.92361","-102.308768",534.75,73.7,"J1","J1",
> 559,"#7F7F7F","#FF0000",74.7,73.8,"J1<br>0
psi",0],
>
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
> 261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
>
397.5,80.8,"SL1","SL1",561,"#7F7F7F","#FF0000",81.3,81.9,"SL1<br>0
>
psi",0],["35.931186","-102.304202",390.0,165.2,"SL2","SL2",
>
110823130,"#7F7F7F","#FF0000",165.4,165.6,"SL2<br>0
psi",0],
>
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
> 563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
>
["35.931301","-102.29965",397.5,23.7,"SL5","SL5",
> 564,"#7F7F7F","#FF0000",23.9,23.0,"SL5<br>0
psi",0],
>
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
> 7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]];
> 
> and the code seems to work with it like an array. How do i get the
> responseText from the server as an array?
> 
> thanks again.
> 
> sk
> 
> On Dec 13, 4:08 pm, Frederick Cheung
<frederick.che...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
> wrote:
>> On 13 Dec 2011, at 19:54, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>> 
>>> Jim.
>> 
>>> You are correct, when i show typeof(sites) from when sites =
<%>>> @mapped_sites =>
>>> i get object
>>> when i do typeof(sites) after getting sites from the
>>> url_that_returns_json
>>> i get string
>> 
>> responseText is always going to be text if I remember how prototype
handles thing (the text will just happen to be the string representation of the
json).
>> If the response content-type was set correctly then
response.responseJson (or something like that) should be populated
>> 
>> Fred
>> 
>> 
>> 
>> 
>> 
>> 
>> 
>>> i suppose that i am not getting returned correctly.
>>> if i look at the source of @mapped_sites
>>> and from the browser look at url_that_returns_json,
>>> they are identical.
>> 
>>> thanks for your help, again.
>>> I have learned a lot the last couple of days :)
>> 
>>> On Dec 12, 6:22 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>> On Tue, Dec 13, 2011 at 6:08 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>>>>> I am doing something similar here. The website is built on
rails 2.3.9
>>>>> and
>>>>> uses prototype.
>> 
>>>>> Almost all of what i need to happen does, but i get to the
point where
>>>>> the update happens and nothing does.
>> 
>>>>> // add circles to map as it initializes
>>>>>    addCircles(sites, map, markerArray, lineArray);
>> 
>>>>>    var pe = new
PeriodicalExecuter(refreshCircleMarkers.curry(markerArray,
>>>>> lineArray, map), 33);
>> 
>>>>> function refreshCircleMarkers(markerArray, lineArray, map)
{
>>>>>   // first we remove the existing markers in place
>>>>>   for(i=0; i<markerArray.length; i++) {
>>>>>     markerArray[i].setMap(null);
>>>>>   }
>> 
>>>>   // and empty the array itself>   markerArray = [];
>> 
>>>>>   var url = "/group/update_mapv3_circles";
>>>>>   new Ajax.Request(url, {
>>>>>     method: ''get'',
>>>>>     onSuccess: function(response) {
>>>>>       var sites = response.responseText;
>>>>>       addCircles(sites, map, markerArray, lineArray);
>>>>>     }
>>>>>   });
>> 
>>>> I see nothing wrong. Does the addCircles function expect a JSON
>>>> object for the first param?  The only reason I can think why
this isn''t
>>>> working
>>>> is a type mismatch.
>> 
>>>>> If i do an alert(response.responseText) the alert will show
up and
>>>>> display the contents of the @mapped_sites.to_json ( i am
using
>>>>> render :json => @mapped_sites.to_json in the
controller).
>>>>> Please let me know if you see something i am doing wrong.
>>>>> Thanks for your help on this so far Jim.
>> 
>>>>> sk
>> 
>>>>> On Dec 9, 11:49 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>>>> On Sat, Dec 10, 2011 at 3:56 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>>>>>>> I am intrigued by this solution, Jim.
>>>>>>> i have a couple of questions, as it seems this is a
cleaner way than
>>>>>>> what I am trying to do.
>>>>>>> The values that determine the circle color are in
the database, and
>>>>>>> can change while the page is loaded. This is why i
need them to
>>>>>>> update.
>> 
>>>>>> i''ll still go with my suggestion earlier.  To
update the colors, just
>>>>> update
>>>>>> the sites variable after completing the ajax request
and then call
>>>>>> addCircles
>> 
>>>>>> your ajax call may look like the following (this is
totally untested :D)
>> 
>>>>>> $.ajax({
>>>>>>   url:
your_url_here_that_returns_json_equivalent_of_@mapped_sites,
>>>>>>   success: function(data) {
>>>>>>     addCircles(data);
>>>>>>   }
>> 
>>>>>> });
>>>>>>> So, somehow i still need to go to the server for
that. I guess i am
>>>>>>> missing the part about how to get the @mapped_sites
variable to the
>>>>>>> controller and back again to the page to rebuild
the circles.
>>>>>>> Thanks for your time on this.
>>>>>>> sk
>> 
>>>>>>> On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>>>>>> On Fri, Dec 9, 2011 at 11:04 PM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>>>>>>>>> Hey, thanks for these links, very helpful.
>>>>>>>>> -sk
>> 
>>>>>>>>> On Dec 8, 7:49 pm,
"L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>>>>>>>> Hi,
>> 
>>>>>>>>>>       For this you need to use rjs Ajax
request. Please refer the
>>>>>>>>>> following links, you will get an idea.
>> 
>>>>>>>>>>
1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
>>>>>>>>>> 2.
>>>>>>>
http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
>> 
>>>>>>>> one more option is to keep @mapped_sites to a
javascript variable so
>>>>> you
>>>>>>>> dont have to use ajax.  you might also want to
move the makeMarker
>>>>> part
>>>>>>>> to a js function to tidy up the view and just
call that function
>>>>> when you
>>>>>>>> need
>>>>>>>> to update the colors
>> 
>>>>>>>> something along the lines of
>> 
>>>>>>>> var sites = <%= @mapped_sites.to_json %>;
>>>>>>>> addCircles(sites);
>> 
>>>>>>>> function addCircles(circles) {
>>>>>>>>   for(i=0; i<circles.length; i++) {
>>>>>>>>     center = new
google.maps.LatLng(circles[i][0], circles[i][1]);
>>>>>>>>     siteCircle = makeMarker({
>>>>>>>>       position: center,
>>>>>>>>       strokeColor: "#FF0000",
>>>>>>>>       strokeOpacity: 0.8,
>>>>>>>>       strokeWeight: 2,
>>>>>>>>       fillColor: circles[i][7],
>>>>>>>>       fillOpacity: 0.75,
>>>>>>>>       radius: 560,
>>>>>>>>       map: map,
>>>>>>>>       center: center,
>>>>>>>>       radius: circles[i][2],
>>>>>>>>       title: circles[i][5],
>>>>>>>>       content: ''content''
>>>>>>>>     });
>>>>>>>>   }
>> 
>>>>>>>> }
>> 
>>>>>>>> then you just need to update the sites variable
using js. no need
>>>>>>>> to go back to the server.
>> 
>>>>>>>>>> On Thu, Dec 8, 2011 at 1:10 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>> 
>>>>>>>>>>> Hey all,
>>>>>>>>>>> i have a google map and i am
drawing circles on the map like
>>>>> this..
>> 
>>>>>>>>>>>  var latlng = new
google.maps.LatLng(35.931387,
>>>>>>>>>>> -102.31062);
>>>>>>>>>>>    var myMapOptions
>>>>>>>>>>> {
>>>>>>>>>>>      zoom:
>>>>>>>>>>> 12,
>>>>>>>>>>>      center:
>>>>>>>>>>> latlng,
>>>>>>>>>>>      mapTypeId:
>>>>>>>>>>> google.maps.MapTypeId.HYBRID
>>>>>>>>>>>    };
>> 
>>>>>>>>>>>    var map = new
>>>>>>>>>>>
google.maps.Map(document.getElementById("map_canvas"),
>>>>>>>>>>> myMapOptions);
>>>>>>>>>>>    var infoWindow = new
>>>>>>>>>>> google.maps.InfoWindow();
>>>>>>>>>>>    var markerBounds = new
>>>>>>>>>>> google.maps.LatLngBounds();
>> 
>>>>>>>>>>>   <% @mapped_sites.each do |row|
>>>>>>>>>>> %>
>> 
>>>>>>>>>>>        // main
>>>>>>>>>>> circle
>>>>>>>>>>>        center = new
google.maps.LatLng(<%= "#{row[0]}" %>,
<%>>>>>>>>>>> "#{row[1]}"
>>>>>>>>>>> %>);
>>>>>>>>>>>        siteCircle
>>>>>>>>>>> makeMarker({
>>>>>>>>>>>          position:
>>>>>>>>>>> center,
>>>>>>>>>>>          strokeColor:
>>>>>>>>>>> "#FF0000",
>>>>>>>>>>>          strokeOpacity:
>>>>>>>>>>> 0.8,
>>>>>>>>>>>          strokeWeight:
>>>>>>>>>>> 2,
>>>>>>>>>>>          fillColor:
''<%= "#{row[7]}"
>>>>>>>>>>> %>'',
>>>>>>>>>>>          fillOpacity:
>>>>>>>>>>> 0.75,
>>>>>>>>>>>          radius:
>>>>>>>>>>> 560,
>>>>>>>>>>>          map:
>>>>>>>>>>> map,
>>>>>>>>>>>          center:
>>>>>>>>>>> center,
>>>>>>>>>>>          radius: <%=
"#{row[2]}"
>>>>>>>>>>> %>,
>>>>>>>>>>>          title: ''<%=
"#{row[5]}"
>>>>>>>>>>> %>'',
>>>>>>>>>>>          content: ''<%=
"some contnet
>>>>>>>>>>> %>''
>>>>>>>>>>>       });
>> 
>>>>>>>>>>>       markerArray.push(siteCircle);
>> 
>>>>>>>>>>> my question is, that since the
fillColor is going to change
>>>>> from
>>>>>>> time
>>>>>>>>>>> to time, i want to update all the
colors of the circles
>>>>>>> periodically.
>>>>>>>>>>> What i don''t know how to
do is get the equivelent to the
>>>>>>>>>>> @mapped_sites  because if i could,
i think i could just delete
>>>>> the
>>>>>>>>>>> existing circles and draw new ones.
>> 
>>>>>>>>>>> How do i get info back from the
server periodically to update
>>>>> the
>>>>>>>>>>> circle colors?
>> 
>>>>>>>>>>> thanks to all.
>>>>>>>>>>> skrite
>> 
>>>>>>>>>>> --
>>>>>>>>>>> You received this message because
you are subscribed to the
>>>>> Google
>>>>>>>>> Groups "Ruby on Rails: Talk"
group.
>>>>>>>>>>> To post to this group, send email
to
>>>>>>>
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
>>>>>>>>> .
>>>>>>>>>>> To unsubscribe from this group,
send email to
>>>>>>>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
>>>>>>>>>>> For more options, visit this group
athttp://
>>>>>>>>>
groups.google.com/group/rubyonrails-talk?hl=en.
>> 
>>>>>>>>>> --
>> 
>>>>>>>>>> Regards,
>>>>>>>>>> L.KarthiKeyan.
>> 
>>>>>>>>> --
>>>>>>>>> You received this message because you are
subscribed to the Google
>>>>>>> Groups
>>>>>>>>> "Ruby on Rails: Talk" group.
>>>>>>>>> To post to this group, send email to
>>>>> rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
>>>>>>> .
>>>>>>>>> To unsubscribe from this group, send email
to
>>>>>>>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
>>>>>>>>> For more options, visit this group at
>>>>>>>>>
http://groups.google.com/group/rubyonrails-talk?hl=en.
>> 
>>>>>>>> --
>>>>>>>>
-------------------------------------------------------------
>>>>>>>> visit my blog athttp://jimlabs.heroku.com
>> 
>>>>>>> --
>>>>>>> You received this message because you are
subscribed to the Google
>>>>> Groups
>>>>>>> "Ruby on Rails: Talk" group.
>>>>>>> To post to this group, send email to
rubyonrails-talk@googlegroups.com
>>>>> .
>>>>>>> To unsubscribe from this group, send email to
>>>>>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
>>>>>>> For more options, visit this group at
>>>>>>>
http://groups.google.com/group/rubyonrails-talk?hl=en.
>> 
>>>>>> --
>>>>>>
-------------------------------------------------------------
>>>>>> visit my blog athttp://jimlabs.heroku.com
>> 
>>>>> --
>>>>> You received this message because you are subscribed to the
Google Groups
>>>>> "Ruby on Rails: Talk" group.
>>>>> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh4Ykp1iOSErHA@public.gmane.orgm.
>>>>> To unsubscribe from this group, send email to
>>>>>
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
>>>>> For more options, visit this group at
>>>>> http://groups.google.com/group/rubyonrails-talk?hl=en.
>> 
>>>> --
>>>> -------------------------------------------------------------
>>>> visit my blog athttp://jimlabs.heroku.com
>> 
>>> --
>>> You received this message because you are subscribed to the Google
Groups "Ruby on Rails: Talk" group.
>>> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
>>> To unsubscribe from this group, send email to
>> 
>> ...
>> 
>> read more »
> 
> -- 
> You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
> For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.
> 
-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

skrite

2011-Dec-14 09:12 UTC

head link

Re: how to use javascript to update markers on Google maps

OK, i did try your example and the circles disappear, but never
update. Then, nothing. there are no errors in the inspect element of
chrome under the console, nothing updates, it just kinda freezes
there. I can see the queries being pulled in the webrick server logs.
a prettier image of the code is here http://pastie.org/3014696
(also more complete).
I know i am fumbling over something obvious here, but just cannot seem
to work it out.

when i use the request address update_mapv3_circles in a browser, this
is the response
[["35.931341","-102.32205",381.75,287.4,"AL","AL",
557,"#7F7F7F","#FF0000",287.8,287.6,"AL<br>0
psi",0],
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
34280,"#7F7F7F","#FF0000",83.6,83.1,"DC<br>0
psi",0],
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
["35.92361","-102.308768",534.75,74.8,"J1","J1",
559,"#7F7F7F","#FF0000",74.6,74.5,"J1<br>0
psi",0],
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
397.5,82.1,"SL1","SL1",561,"#7F7F7F","#FF0000",80.9,81.9,"SL1<br>0
psi",0],["35.931186","-102.304202",390.0,165.4,"SL2","SL2",
110823130,"#7F7F7F","#FF0000",165.5,165.6,"SL2<br>0
psi",0],
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
["35.931301","-102.29965",397.5,23.4,"SL5","SL5",
564,"#7F7F7F","#FF0000",23.0,23.4,"SL5<br>0
psi",0],
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]]

in the view source of the website where <%= @mapped_sites.to_json %>
is , i have this
var sites =
[["35.931341","-102.32205",381.75,287.4,"AL","AL",
557,"#7F7F7F","#FF0000",287.8,287.6,"AL<br>0
psi",0],
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
34280,"#7F7F7F","#FF0000",83.6,83.1,"DC<br>0
psi",0],
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
["35.92361","-102.308768",534.75,74.8,"J1","J1",
559,"#7F7F7F","#FF0000",74.6,74.5,"J1<br>0
psi",0],
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
397.5,82.1,"SL1","SL1",561,"#7F7F7F","#FF0000",80.9,81.9,"SL1<br>0
psi",0],["35.931186","-102.304202",390.0,165.4,"SL2","SL2",
110823130,"#7F7F7F","#FF0000",165.5,165.6,"SL2<br>0
psi",0],
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
["35.931301","-102.29965",397.5,23.4,"SL5","SL5",
564,"#7F7F7F","#FF0000",23.0,23.4,"SL5<br>0
psi",0],
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]];

Anyway, thanks for all of your help so far, this is at least less
baffling to me than it was a couple of days ago.


sk


On Dec 14, 2:52 am, Frederick Cheung
<frederick.che...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> On 14 Dec 2011, at 05:47, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> > ok, even though the @mapped_sites.to_json works, the output of that
> > does not look like json. It looks like an array
>
> If my memory is correct, that''s valid json too ( as are most
literals). It''s common for the top level thing to be an object rather
than an array, but not mandatory. Since the thing you called to_json on was an
array, you got the json representation of an array back.
>
> To get the non text version of the response, like I said earlier look at
response.responseJSON
>
> Fred
>
>
>
>
>
>
>
> > example:
>
> > var sites =
[["35.931341","-102.32205",381.75,288.0,"AL","AL",
> >
557,"#7F7F7F","#FF0000",287.1,288.3,"AL<br>0
psi",0],
> >
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
> >
34280,"#7F7F7F","#FF0000",83.1,83.3,"DC<br>0
psi",0],
> >
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
> >
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
> >
["35.92361","-102.308768",534.75,73.7,"J1","J1",
> >
559,"#7F7F7F","#FF0000",74.7,73.8,"J1<br>0
psi",0],
> >
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
> > 261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
> >
397.5,80.8,"SL1","SL1",561,"#7F7F7F","#FF0000",81.3,81.9,"SL1<br>0
> >
psi",0],["35.931186","-102.304202",390.0,165.2,"SL2","SL2",
> >
110823130,"#7F7F7F","#FF0000",165.4,165.6,"SL2<br>0
psi",0],
> >
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
> >
563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
> >
["35.931301","-102.29965",397.5,23.7,"SL5","SL5",
> >
564,"#7F7F7F","#FF0000",23.9,23.0,"SL5<br>0
psi",0],
> >
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
> >
7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]];
>
> > and the code seems to work with it like an array. How do i get the
> > responseText from the server as an array?
>
> > thanks again.
>
> > sk
>
> > On Dec 13, 4:08 pm, Frederick Cheung
<frederick.che...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
> > wrote:
> >> On 13 Dec 2011, at 19:54, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> >>> Jim.
>
> >>> You are correct, when i show typeof(sites) from when sites =
<%> >>> @mapped_sites =>
> >>> i get object
> >>> when i do typeof(sites) after getting sites from the
> >>> url_that_returns_json
> >>> i get string
>
> >> responseText is always going to be text if I remember how
prototype handles thing (the text will just happen to be the string
representation of the json).
> >> If the response content-type was set correctly then
response.responseJson (or something like that) should be populated
>
> >> Fred
>
> >>> i suppose that i am not getting returned correctly.
> >>> if i look at the source of @mapped_sites
> >>> and from the browser look at url_that_returns_json,
> >>> they are identical.
>
> >>> thanks for your help, again.
> >>> I have learned a lot the last couple of days :)
>
> >>> On Dec 12, 6:22 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>> On Tue, Dec 13, 2011 at 6:08 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >>>>> I am doing something similar here. The website is
built on rails 2.3.9
> >>>>> and
> >>>>> uses prototype.
>
> >>>>> Almost all of what i need to happen does, but i get to
the point where
> >>>>> the update happens and nothing does.
>
> >>>>> // add circles to map as it initializes
> >>>>>    addCircles(sites, map, markerArray, lineArray);
>
> >>>>>    var pe = new
PeriodicalExecuter(refreshCircleMarkers.curry(markerArray,
> >>>>> lineArray, map), 33);
>
> >>>>> function refreshCircleMarkers(markerArray, lineArray,
map) {
> >>>>>   // first we remove the existing markers in place
> >>>>>   for(i=0; i<markerArray.length; i++) {
> >>>>>     markerArray[i].setMap(null);
> >>>>>   }
>
> >>>>   // and empty the array itself>   markerArray = [];
>
> >>>>>   var url = "/group/update_mapv3_circles";
> >>>>>   new Ajax.Request(url, {
> >>>>>     method: ''get'',
> >>>>>     onSuccess: function(response) {
> >>>>>       var sites = response.responseText;
> >>>>>       addCircles(sites, map, markerArray, lineArray);
> >>>>>     }
> >>>>>   });
>
> >>>> I see nothing wrong. Does the addCircles function expect a
JSON
> >>>> object for the first param?  The only reason I can think
why this isn''t
> >>>> working
> >>>> is a type mismatch.
>
> >>>>> If i do an alert(response.responseText) the alert will
show up and
> >>>>> display the contents of the @mapped_sites.to_json ( i
am using
> >>>>> render :json => @mapped_sites.to_json in the
controller).
> >>>>> Please let me know if you see something i am doing
wrong.
> >>>>> Thanks for your help on this so far Jim.
>
> >>>>> sk
>
> >>>>> On Dec 9, 11:49 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>>>> On Sat, Dec 10, 2011 at 3:56 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >>>>>>> I am intrigued by this solution, Jim.
> >>>>>>> i have a couple of questions, as it seems this
is a cleaner way than
> >>>>>>> what I am trying to do.
> >>>>>>> The values that determine the circle color are
in the database, and
> >>>>>>> can change while the page is loaded. This is
why i need them to
> >>>>>>> update.
>
> >>>>>> i''ll still go with my suggestion earlier.
 To update the colors, just
> >>>>> update
> >>>>>> the sites variable after completing the ajax
request and then call
> >>>>>> addCircles
>
> >>>>>> your ajax call may look like the following (this
is totally untested :D)
>
> >>>>>> $.ajax({
> >>>>>>   url:
your_url_here_that_returns_json_equivalent_of_@mapped_sites,
> >>>>>>   success: function(data) {
> >>>>>>     addCircles(data);
> >>>>>>   }
>
> >>>>>> });
> >>>>>>> So, somehow i still need to go to the server
for that. I guess i am
> >>>>>>> missing the part about how to get the
@mapped_sites variable to the
> >>>>>>> controller and back again to the page to
rebuild the circles.
> >>>>>>> Thanks for your time on this.
> >>>>>>> sk
>
> >>>>>>> On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>>>>>> On Fri, Dec 9, 2011 at 11:04 PM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >>>>>>>>> Hey, thanks for these links, very
helpful.
> >>>>>>>>> -sk
>
> >>>>>>>>> On Dec 8, 7:49 pm,
"L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>>>>>>>> Hi,
>
> >>>>>>>>>>       For this you need to use rjs
Ajax request. Please refer the
> >>>>>>>>>> following links, you will get an
idea.
>
> >>>>>>>>>>
1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
> >>>>>>>>>> 2.
>
>>>>>>>http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
>
> >>>>>>>> one more option is to keep @mapped_sites
to a javascript variable so
> >>>>> you
> >>>>>>>> dont have to use ajax.  you might also
want to move the makeMarker
> >>>>> part
> >>>>>>>> to a js function to tidy up the view and
just call that function
> >>>>> when you
> >>>>>>>> need
> >>>>>>>> to update the colors
>
> >>>>>>>> something along the lines of
>
> >>>>>>>> var sites = <%= @mapped_sites.to_json
%>;
> >>>>>>>> addCircles(sites);
>
> >>>>>>>> function addCircles(circles) {
> >>>>>>>>   for(i=0; i<circles.length; i++) {
> >>>>>>>>     center = new
google.maps.LatLng(circles[i][0], circles[i][1]);
> >>>>>>>>     siteCircle = makeMarker({
> >>>>>>>>       position: center,
> >>>>>>>>       strokeColor: "#FF0000",
> >>>>>>>>       strokeOpacity: 0.8,
> >>>>>>>>       strokeWeight: 2,
> >>>>>>>>       fillColor: circles[i][7],
> >>>>>>>>       fillOpacity: 0.75,
> >>>>>>>>       radius: 560,
> >>>>>>>>       map: map,
> >>>>>>>>       center: center,
> >>>>>>>>       radius: circles[i][2],
> >>>>>>>>       title: circles[i][5],
> >>>>>>>>       content: ''content''
> >>>>>>>>     });
> >>>>>>>>   }
>
> >>>>>>>> }
>
> >>>>>>>> then you just need to update the sites
variable using js. no need
> >>>>>>>> to go back to the server.
>
> >>>>>>>>>> On Thu, Dec 8, 2011 at 1:10 AM,
skrite <sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> >>>>>>>>>>> Hey all,
> >>>>>>>>>>> i have a google map and i am
drawing circles on the map like
> >>>>> this..
>
> >>>>>>>>>>>  var latlng = new
google.maps.LatLng(35.931387,
> >>>>>>>>>>> -102.31062);
> >>>>>>>>>>>    var myMapOptions >
>>>>>>>>>>> {
> >>>>>>>>>>>      zoom:
> >>>>>>>>>>> 12,
> >>>>>>>>>>>      center:
> >>>>>>>>>>> latlng,
> >>>>>>>>>>>      mapTypeId:
> >>>>>>>>>>> google.maps.MapTypeId.HYBRID
> >>>>>>>>>>>    };
>
> >>>>>>>>>>>    var map = new
> >>>>>>>>>>>
google.maps.Map(document.getElementById("map_canvas"),
> >>>>>>>>>>> myMapOptions);
> >>>>>>>>>>>    var infoWindow = new
> >>>>>>>>>>> google.maps.InfoWindow();
> >>>>>>>>>>>    var markerBounds = new
> >>>>>>>>>>> google.maps.LatLngBounds();
>
> >>>>>>>>>>>   <% @mapped_sites.each do
|row|
> >>>>>>>>>>> %>
>
> >>>>>>>>>>>        // main
> >>>>>>>>>>> circle
> >>>>>>>>>>>        center = new
google.maps.LatLng(<%= "#{row[0]}" %>, <%>
>>>>>>>>>>> "#{row[1]}"
> >>>>>>>>>>> %>);
> >>>>>>>>>>>        siteCircle >
>>>>>>>>>>> makeMarker({
> >>>>>>>>>>>          position:
> >>>>>>>>>>> center,
> >>>>>>>>>>>          strokeColor:
> >>>>>>>>>>> "#FF0000",
> >>>>>>>>>>>          strokeOpacity:
> >>>>>>>>>>> 0.8,
> >>>>>>>>>>>          strokeWeight:
> >>>>>>>>>>> 2,
> >>>>>>>>>>>          fillColor:
''<%= "#{row[7]}"
> >>>>>>>>>>> %>'',
> >>>>>>>>>>>          fillOpacity:
> >>>>>>>>>>> 0.75,
> >>>>>>>>>>>          radius:
> >>>>>>>>>>> 560,
> >>>>>>>>>>>          map:
> >>>>>>>>>>> map,
> >>>>>>>>>>>          center:
> >>>>>>>>>>> center,
> >>>>>>>>>>>          radius: <%=
"#{row[2]}"
> >>>>>>>>>>> %>,
> >>>>>>>>>>>          title:
''<%= "#{row[5]}"
> >>>>>>>>>>> %>'',
> >>>>>>>>>>>          content:
''<%= "some contnet
> >>>>>>>>>>> %>''
> >>>>>>>>>>>       });
>
> >>>>>>>>>>>      
markerArray.push(siteCircle);
>
> >>>>>>>>>>> my question is, that since the
fillColor is going to change
> >>>>> from
> >>>>>>> time
> >>>>>>>>>>> to time, i want to update all
the colors of the circles
> >>>>>>> periodically.
> >>>>>>>>>>> What i don''t know how
to do is get the equivelent to the
> >>>>>>>>>>> @mapped_sites  because if i
could, i think i could just delete
> >>>>> the
> >>>>>>>>>>> existing circles and draw new
ones.
>
> >>>>>>>>>>> How do i get info back from
the server periodically to update
> >>>>> the
> >>>>>>>>>>> circle colors?
>
> >>>>>>>>>>> thanks to all.
> >>>>>>>>>>> skrite
>
> >>>>>>>>>>> --
> >>>>>>>>>>> You received this message
because you are subscribed to the
> >>>>> Google
> >>>>>>>>> Groups "Ruby on Rails: Talk"
group.
> >>>>>>>>>>> To post to this
>
> ...
>
> read more »
-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

Frederick Cheung

2011-Dec-14 09:48 UTC

head link

Re: Re: how to use javascript to update markers on Google maps

On 14 Dec 2011, at 09:12, skrite
<shawn-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> OK, i did try your example and the circles disappear, but never
> update. Then, nothing. there are no errors in the inspect element of
> chrome under the console, nothing updates, it just kinda freezes
> there. I can see the queries being pulled in the webrick server logs.
> a prettier image of the code is here http://pastie.org/3014696
> (also more complete).
Because you''ve called the parameter that is passed to you Ajax callback
''response'', you need response.responseJSON not
request.responseJSON
Stick a breakpoint in there to investigate further
Fred> I know i am fumbling over something obvious here, but just cannot seem
> to work it out.
> 
> when i use the request address update_mapv3_circles in a browser, this
> is the response
>
[["35.931341","-102.32205",381.75,287.4,"AL","AL",
> 557,"#7F7F7F","#FF0000",287.8,287.6,"AL<br>0
psi",0],
>
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
> 34280,"#7F7F7F","#FF0000",83.6,83.1,"DC<br>0
psi",0],
>
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
>
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
>
["35.92361","-102.308768",534.75,74.8,"J1","J1",
> 559,"#7F7F7F","#FF0000",74.6,74.5,"J1<br>0
psi",0],
>
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
> 261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
>
397.5,82.1,"SL1","SL1",561,"#7F7F7F","#FF0000",80.9,81.9,"SL1<br>0
>
psi",0],["35.931186","-102.304202",390.0,165.4,"SL2","SL2",
>
110823130,"#7F7F7F","#FF0000",165.5,165.6,"SL2<br>0
psi",0],
>
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
> 563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
>
["35.931301","-102.29965",397.5,23.4,"SL5","SL5",
> 564,"#7F7F7F","#FF0000",23.0,23.4,"SL5<br>0
psi",0],
>
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
> 7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]]
> 
> in the view source of the website where <%= @mapped_sites.to_json %>
> is , i have this
> var sites =
[["35.931341","-102.32205",381.75,287.4,"AL","AL",
> 557,"#7F7F7F","#FF0000",287.8,287.6,"AL<br>0
psi",0],
>
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
> 34280,"#7F7F7F","#FF0000",83.6,83.1,"DC<br>0
psi",0],
>
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
>
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
>
["35.92361","-102.308768",534.75,74.8,"J1","J1",
> 559,"#7F7F7F","#FF0000",74.6,74.5,"J1<br>0
psi",0],
>
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
> 261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
>
397.5,82.1,"SL1","SL1",561,"#7F7F7F","#FF0000",80.9,81.9,"SL1<br>0
>
psi",0],["35.931186","-102.304202",390.0,165.4,"SL2","SL2",
>
110823130,"#7F7F7F","#FF0000",165.5,165.6,"SL2<br>0
psi",0],
>
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
> 563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
>
["35.931301","-102.29965",397.5,23.4,"SL5","SL5",
> 564,"#7F7F7F","#FF0000",23.0,23.4,"SL5<br>0
psi",0],
>
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
> 7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]];
> 
> Anyway, thanks for all of your help so far, this is at least less
> baffling to me than it was a couple of days ago.
> 
> 
> sk
> 
> 
> On Dec 14, 2:52 am, Frederick Cheung
<frederick.che...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
> wrote:
>> On 14 Dec 2011, at 05:47, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>> 
>>> ok, even though the @mapped_sites.to_json works, the output of that
>>> does not look like json. It looks like an array
>> 
>> If my memory is correct, that''s valid json too ( as are most
literals). It''s common for the top level thing to be an object rather
than an array, but not mandatory. Since the thing you called to_json on was an
array, you got the json representation of an array back.
>> 
>> To get the non text version of the response, like I said earlier look
at response.responseJSON
>> 
>> Fred
>> 
>> 
>> 
>> 
>> 
>> 
>> 
>>> example:
>> 
>>> var sites =
[["35.931341","-102.32205",381.75,288.0,"AL","AL",
>>>
557,"#7F7F7F","#FF0000",287.1,288.3,"AL<br>0
psi",0],
>>>
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
>>>
34280,"#7F7F7F","#FF0000",83.1,83.3,"DC<br>0
psi",0],
>>>
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
>>>
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
>>>
["35.92361","-102.308768",534.75,73.7,"J1","J1",
>>>
559,"#7F7F7F","#FF0000",74.7,73.8,"J1<br>0
psi",0],
>>>
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
>>> 261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
>>>
397.5,80.8,"SL1","SL1",561,"#7F7F7F","#FF0000",81.3,81.9,"SL1<br>0
>>>
psi",0],["35.931186","-102.304202",390.0,165.2,"SL2","SL2",
>>>
110823130,"#7F7F7F","#FF0000",165.4,165.6,"SL2<br>0
psi",0],
>>>
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
>>>
563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
>>>
["35.931301","-102.29965",397.5,23.7,"SL5","SL5",
>>>
564,"#7F7F7F","#FF0000",23.9,23.0,"SL5<br>0
psi",0],
>>>
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
>>>
7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]];
>> 
>>> and the code seems to work with it like an array. How do i get the
>>> responseText from the server as an array?
>> 
>>> thanks again.
>> 
>>> sk
>> 
>>> On Dec 13, 4:08 pm, Frederick Cheung
<frederick.che...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
>>> wrote:
>>>> On 13 Dec 2011, at 19:54, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>> 
>>>>> Jim.
>> 
>>>>> You are correct, when i show typeof(sites) from when sites
= <%>>>>> @mapped_sites =>
>>>>> i get object
>>>>> when i do typeof(sites) after getting sites from the
>>>>> url_that_returns_json
>>>>> i get string
>> 
>>>> responseText is always going to be text if I remember how
prototype handles thing (the text will just happen to be the string
representation of the json).
>>>> If the response content-type was set correctly then
response.responseJson (or something like that) should be populated
>> 
>>>> Fred
>> 
>>>>> i suppose that i am not getting returned correctly.
>>>>> if i look at the source of @mapped_sites
>>>>> and from the browser look at url_that_returns_json,
>>>>> they are identical.
>> 
>>>>> thanks for your help, again.
>>>>> I have learned a lot the last couple of days :)
>> 
>>>>> On Dec 12, 6:22 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>>>> On Tue, Dec 13, 2011 at 6:08 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>>>>>>> I am doing something similar here. The website is
built on rails 2.3.9
>>>>>>> and
>>>>>>> uses prototype.
>> 
>>>>>>> Almost all of what i need to happen does, but i get
to the point where
>>>>>>> the update happens and nothing does.
>> 
>>>>>>> // add circles to map as it initializes
>>>>>>>    addCircles(sites, map, markerArray, lineArray);
>> 
>>>>>>>    var pe = new
PeriodicalExecuter(refreshCircleMarkers.curry(markerArray,
>>>>>>> lineArray, map), 33);
>> 
>>>>>>> function refreshCircleMarkers(markerArray,
lineArray, map) {
>>>>>>>   // first we remove the existing markers in place
>>>>>>>   for(i=0; i<markerArray.length; i++) {
>>>>>>>     markerArray[i].setMap(null);
>>>>>>>   }
>> 
>>>>>>   // and empty the array itself>   markerArray = [];
>> 
>>>>>>>   var url =
"/group/update_mapv3_circles";
>>>>>>>   new Ajax.Request(url, {
>>>>>>>     method: ''get'',
>>>>>>>     onSuccess: function(response) {
>>>>>>>       var sites = response.responseText;
>>>>>>>       addCircles(sites, map, markerArray,
lineArray);
>>>>>>>     }
>>>>>>>   });
>> 
>>>>>> I see nothing wrong. Does the addCircles function
expect a JSON
>>>>>> object for the first param?  The only reason I can
think why this isn''t
>>>>>> working
>>>>>> is a type mismatch.
>> 
>>>>>>> If i do an alert(response.responseText) the alert
will show up and
>>>>>>> display the contents of the @mapped_sites.to_json (
i am using
>>>>>>> render :json => @mapped_sites.to_json in the
controller).
>>>>>>> Please let me know if you see something i am doing
wrong.
>>>>>>> Thanks for your help on this so far Jim.
>> 
>>>>>>> sk
>> 
>>>>>>> On Dec 9, 11:49 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>>>>>> On Sat, Dec 10, 2011 at 3:56 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>>>>>>>>> I am intrigued by this solution, Jim.
>>>>>>>>> i have a couple of questions, as it seems
this is a cleaner way than
>>>>>>>>> what I am trying to do.
>>>>>>>>> The values that determine the circle color
are in the database, and
>>>>>>>>> can change while the page is loaded. This
is why i need them to
>>>>>>>>> update.
>> 
>>>>>>>> i''ll still go with my suggestion
earlier.  To update the colors, just
>>>>>>> update
>>>>>>>> the sites variable after completing the ajax
request and then call
>>>>>>>> addCircles
>> 
>>>>>>>> your ajax call may look like the following
(this is totally untested :D)
>> 
>>>>>>>> $.ajax({
>>>>>>>>   url:
your_url_here_that_returns_json_equivalent_of_@mapped_sites,
>>>>>>>>   success: function(data) {
>>>>>>>>     addCircles(data);
>>>>>>>>   }
>> 
>>>>>>>> });
>>>>>>>>> So, somehow i still need to go to the
server for that. I guess i am
>>>>>>>>> missing the part about how to get the
@mapped_sites variable to the
>>>>>>>>> controller and back again to the page to
rebuild the circles.
>>>>>>>>> Thanks for your time on this.
>>>>>>>>> sk
>> 
>>>>>>>>> On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>>>>>>>> On Fri, Dec 9, 2011 at 11:04 PM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>>>>>>>>>>> Hey, thanks for these links, very
helpful.
>>>>>>>>>>> -sk
>> 
>>>>>>>>>>> On Dec 8, 7:49 pm,
"L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>>>>>>>>>>>> Hi,
>> 
>>>>>>>>>>>>       For this you need to use
rjs Ajax request. Please refer the
>>>>>>>>>>>> following links, you will get
an idea.
>> 
>>>>>>>>>>>>
1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
>>>>>>>>>>>> 2.
>>>>>>>>>
http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
>> 
>>>>>>>>>> one more option is to keep
@mapped_sites to a javascript variable so
>>>>>>> you
>>>>>>>>>> dont have to use ajax.  you might also
want to move the makeMarker
>>>>>>> part
>>>>>>>>>> to a js function to tidy up the view
and just call that function
>>>>>>> when you
>>>>>>>>>> need
>>>>>>>>>> to update the colors
>> 
>>>>>>>>>> something along the lines of
>> 
>>>>>>>>>> var sites = <%=
@mapped_sites.to_json %>;
>>>>>>>>>> addCircles(sites);
>> 
>>>>>>>>>> function addCircles(circles) {
>>>>>>>>>>   for(i=0; i<circles.length; i++) {
>>>>>>>>>>     center = new
google.maps.LatLng(circles[i][0], circles[i][1]);
>>>>>>>>>>     siteCircle = makeMarker({
>>>>>>>>>>       position: center,
>>>>>>>>>>       strokeColor: "#FF0000",
>>>>>>>>>>       strokeOpacity: 0.8,
>>>>>>>>>>       strokeWeight: 2,
>>>>>>>>>>       fillColor: circles[i][7],
>>>>>>>>>>       fillOpacity: 0.75,
>>>>>>>>>>       radius: 560,
>>>>>>>>>>       map: map,
>>>>>>>>>>       center: center,
>>>>>>>>>>       radius: circles[i][2],
>>>>>>>>>>       title: circles[i][5],
>>>>>>>>>>       content:
''content''
>>>>>>>>>>     });
>>>>>>>>>>   }
>> 
>>>>>>>>>> }
>> 
>>>>>>>>>> then you just need to update the sites
variable using js. no need
>>>>>>>>>> to go back to the server.
>> 
>>>>>>>>>>>> On Thu, Dec 8, 2011 at 1:10 AM,
skrite <sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>> 
>>>>>>>>>>>>> Hey all,
>>>>>>>>>>>>> i have a google map and i
am drawing circles on the map like
>>>>>>> this..
>> 
>>>>>>>>>>>>>  var latlng = new
google.maps.LatLng(35.931387,
>>>>>>>>>>>>> -102.31062);
>>>>>>>>>>>>>    var myMapOptions
>>>>>>>>>>>>> {
>>>>>>>>>>>>>      zoom:
>>>>>>>>>>>>> 12,
>>>>>>>>>>>>>      center:
>>>>>>>>>>>>> latlng,
>>>>>>>>>>>>>      mapTypeId:
>>>>>>>>>>>>>
google.maps.MapTypeId.HYBRID
>>>>>>>>>>>>>    };
>> 
>>>>>>>>>>>>>    var map = new
>>>>>>>>>>>>>
google.maps.Map(document.getElementById("map_canvas"),
>>>>>>>>>>>>> myMapOptions);
>>>>>>>>>>>>>    var infoWindow = new
>>>>>>>>>>>>> google.maps.InfoWindow();
>>>>>>>>>>>>>    var markerBounds = new
>>>>>>>>>>>>> google.maps.LatLngBounds();
>> 
>>>>>>>>>>>>>   <% @mapped_sites.each
do |row|
>>>>>>>>>>>>> %>
>> 
>>>>>>>>>>>>>        // main
>>>>>>>>>>>>> circle
>>>>>>>>>>>>>        center = new
google.maps.LatLng(<%= "#{row[0]}" %>,
<%>>>>>>>>>>>>> "#{row[1]}"
>>>>>>>>>>>>> %>);
>>>>>>>>>>>>>        siteCircle
>>>>>>>>>>>>> makeMarker({
>>>>>>>>>>>>>          position:
>>>>>>>>>>>>> center,
>>>>>>>>>>>>>          strokeColor:
>>>>>>>>>>>>> "#FF0000",
>>>>>>>>>>>>>          strokeOpacity:
>>>>>>>>>>>>> 0.8,
>>>>>>>>>>>>>          strokeWeight:
>>>>>>>>>>>>> 2,
>>>>>>>>>>>>>          fillColor:
''<%= "#{row[7]}"
>>>>>>>>>>>>> %>'',
>>>>>>>>>>>>>          fillOpacity:
>>>>>>>>>>>>> 0.75,
>>>>>>>>>>>>>          radius:
>>>>>>>>>>>>> 560,
>>>>>>>>>>>>>          map:
>>>>>>>>>>>>> map,
>>>>>>>>>>>>>          center:
>>>>>>>>>>>>> center,
>>>>>>>>>>>>>          radius: <%=
"#{row[2]}"
>>>>>>>>>>>>> %>,
>>>>>>>>>>>>>          title:
''<%= "#{row[5]}"
>>>>>>>>>>>>> %>'',
>>>>>>>>>>>>>          content:
''<%= "some contnet
>>>>>>>>>>>>> %>''
>>>>>>>>>>>>>       });
>> 
>>>>>>>>>>>>>      
markerArray.push(siteCircle);
>> 
>>>>>>>>>>>>> my question is, that since
the fillColor is going to change
>>>>>>> from
>>>>>>>>> time
>>>>>>>>>>>>> to time, i want to update
all the colors of the circles
>>>>>>>>> periodically.
>>>>>>>>>>>>> What i don''t know
how to do is get the equivelent to the
>>>>>>>>>>>>> @mapped_sites  because if i
could, i think i could just delete
>>>>>>> the
>>>>>>>>>>>>> existing circles and draw
new ones.
>> 
>>>>>>>>>>>>> How do i get info back from
the server periodically to update
>>>>>>> the
>>>>>>>>>>>>> circle colors?
>> 
>>>>>>>>>>>>> thanks to all.
>>>>>>>>>>>>> skrite
>> 
>>>>>>>>>>>>> --
>>>>>>>>>>>>> You received this message
because you are subscribed to the
>>>>>>> Google
>>>>>>>>>>> Groups "Ruby on Rails:
Talk" group.
>>>>>>>>>>>>> To post to this
>> 
>> ...
>> 
>> read more »
> 
> -- 
> You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
> To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
> To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
> For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.
> 
-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

skrite

2011-Dec-14 15:17 UTC

head link

Re: how to use javascript to update markers on Google maps

That did it !
See what i mean about something obvious?
Thanks very much for your help on this.
You have been a terrific, and patient teacher.

sk


On Dec 14, 3:48 am, Frederick Cheung
<frederick.che...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> On 14 Dec 2011, at 09:12, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> > OK, i did try your example and the circles disappear, but never
> > update. Then, nothing. there are no errors in the inspect element of
> > chrome under the console, nothing updates, it just kinda freezes
> > there. I can see the queries being pulled in the webrick server logs.
> > a prettier image of the code is herehttp://pastie.org/3014696
> > (also more complete).
>
> Because you''ve called the parameter that is passed to you Ajax
callback ''response'', you need response.responseJSON not
request.responseJSON
> Stick a breakpoint in there to investigate further
> Fred
>
>
>
>
>
>
>
> > I know i am fumbling over something obvious here, but just cannot seem
> > to work it out.
>
> > when i use the request address update_mapv3_circles in a browser, this
> > is the response
> >
[["35.931341","-102.32205",381.75,287.4,"AL","AL",
> >
557,"#7F7F7F","#FF0000",287.8,287.6,"AL<br>0
psi",0],
> >
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
> >
34280,"#7F7F7F","#FF0000",83.6,83.1,"DC<br>0
psi",0],
> >
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
> >
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
> >
["35.92361","-102.308768",534.75,74.8,"J1","J1",
> >
559,"#7F7F7F","#FF0000",74.6,74.5,"J1<br>0
psi",0],
> >
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
> > 261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
> >
397.5,82.1,"SL1","SL1",561,"#7F7F7F","#FF0000",80.9,81.9,"SL1<br>0
> >
psi",0],["35.931186","-102.304202",390.0,165.4,"SL2","SL2",
> >
110823130,"#7F7F7F","#FF0000",165.5,165.6,"SL2<br>0
psi",0],
> >
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
> >
563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
> >
["35.931301","-102.29965",397.5,23.4,"SL5","SL5",
> >
564,"#7F7F7F","#FF0000",23.0,23.4,"SL5<br>0
psi",0],
> >
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
> >
7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]]
>
> > in the view source of the website where <%= @mapped_sites.to_json
%>
> > is , i have this
> > var sites =
[["35.931341","-102.32205",381.75,287.4,"AL","AL",
> >
557,"#7F7F7F","#FF0000",287.8,287.6,"AL<br>0
psi",0],
> >
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
> >
34280,"#7F7F7F","#FF0000",83.6,83.1,"DC<br>0
psi",0],
> >
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
> >
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
> >
["35.92361","-102.308768",534.75,74.8,"J1","J1",
> >
559,"#7F7F7F","#FF0000",74.6,74.5,"J1<br>0
psi",0],
> >
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
> > 261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
> >
397.5,82.1,"SL1","SL1",561,"#7F7F7F","#FF0000",80.9,81.9,"SL1<br>0
> >
psi",0],["35.931186","-102.304202",390.0,165.4,"SL2","SL2",
> >
110823130,"#7F7F7F","#FF0000",165.5,165.6,"SL2<br>0
psi",0],
> >
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
> >
563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
> >
["35.931301","-102.29965",397.5,23.4,"SL5","SL5",
> >
564,"#7F7F7F","#FF0000",23.0,23.4,"SL5<br>0
psi",0],
> >
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
> >
7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]];
>
> > Anyway, thanks for all of your help so far, this is at least less
> > baffling to me than it was a couple of days ago.
>
> > sk
>
> > On Dec 14, 2:52 am, Frederick Cheung
<frederick.che...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
> > wrote:
> >> On 14 Dec 2011, at 05:47, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> >>> ok, even though the @mapped_sites.to_json works, the output of
that
> >>> does not look like json. It looks like an array
>
> >> If my memory is correct, that''s valid json too ( as are
most literals). It''s common for the top level thing to be an object
rather than an array, but not mandatory. Since the thing you called to_json on
was an array, you got the json representation of an array back.
>
> >> To get the non text version of the response, like I said earlier
look at response.responseJSON
>
> >> Fred
>
> >>> example:
>
> >>> var sites =
[["35.931341","-102.32205",381.75,288.0,"AL","AL",
> >>>
557,"#7F7F7F","#FF0000",287.1,288.3,"AL<br>0
psi",0],
> >>>
["35.88125039","-102.3088989",525.0,83.4,"DC","DC",
> >>>
34280,"#7F7F7F","#FF0000",83.1,83.3,"DC<br>0
psi",0],
> >>>
["35.88125039","-102.3226989",525.0,81.7,"DC2","DC2",
> >>>
37241,"#000000","#FF0000",81.7,81.7,"DC2<br>0
psi",0],
> >>>
["35.92361","-102.308768",534.75,73.7,"J1","J1",
> >>>
559,"#7F7F7F","#FF0000",74.7,73.8,"J1<br>0
psi",0],
> >>>
["35.92332","-102.32096",493.5,261.0,"J2","J2",560,"#7F7F7F","#FF0000",
> >>> 261.0,261.0,"J2<br>0
psi",0],["35.931354","-102.31308",
> >>>
397.5,80.8,"SL1","SL1",561,"#7F7F7F","#FF0000",81.3,81.9,"SL1<br>0
> >>>
psi",0],["35.931186","-102.304202",390.0,165.2,"SL2","SL2",
> >>>
110823130,"#7F7F7F","#FF0000",165.4,165.6,"SL2<br>0
psi",0],
> >>>
["35.938729","-102.29968",397.5,89.3,"SL4","SL4",
> >>>
563,"#7F7F7F","#FF0000",89.3,89.3,"SL4<br>0
psi",0],
> >>>
["35.931301","-102.29965",397.5,23.7,"SL5","SL5",
> >>>
564,"#7F7F7F","#FF0000",23.9,23.0,"SL5<br>0
psi",0],
> >>>
["35.924694","-102.299034",333.75,95.8,"SL6","SL6",
> >>>
7882,"#7F7F7F","#FF0000",95.8,95.8,"SL6<br>0
psi",0]];
>
> >>> and the code seems to work with it like an array. How do i get
the
> >>> responseText from the server as an array?
>
> >>> thanks again.
>
> >>> sk
>
> >>> On Dec 13, 4:08 pm, Frederick Cheung
<frederick.che...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
> >>> wrote:
> >>>> On 13 Dec 2011, at 19:54, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
>
> >>>>> Jim.
>
> >>>>> You are correct, when i show typeof(sites) from when
sites = <%> >>>>> @mapped_sites =>
> >>>>> i get object
> >>>>> when i do typeof(sites) after getting sites from the
> >>>>> url_that_returns_json
> >>>>> i get string
>
> >>>> responseText is always going to be text if I remember how
prototype handles thing (the text will just happen to be the string
representation of the json).
> >>>> If the response content-type was set correctly then
response.responseJson (or something like that) should be populated
>
> >>>> Fred
>
> >>>>> i suppose that i am not getting returned correctly.
> >>>>> if i look at the source of @mapped_sites
> >>>>> and from the browser look at url_that_returns_json,
> >>>>> they are identical.
>
> >>>>> thanks for your help, again.
> >>>>> I have learned a lot the last couple of days :)
>
> >>>>> On Dec 12, 6:22 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>>>> On Tue, Dec 13, 2011 at 6:08 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >>>>>>> I am doing something similar here. The website
is built on rails 2.3.9
> >>>>>>> and
> >>>>>>> uses prototype.
>
> >>>>>>> Almost all of what i need to happen does, but
i get to the point where
> >>>>>>> the update happens and nothing does.
>
> >>>>>>> // add circles to map as it initializes
> >>>>>>>    addCircles(sites, map, markerArray,
lineArray);
>
> >>>>>>>    var pe = new
PeriodicalExecuter(refreshCircleMarkers.curry(markerArray,
> >>>>>>> lineArray, map), 33);
>
> >>>>>>> function refreshCircleMarkers(markerArray,
lineArray, map) {
> >>>>>>>   // first we remove the existing markers in
place
> >>>>>>>   for(i=0; i<markerArray.length; i++) {
> >>>>>>>     markerArray[i].setMap(null);
> >>>>>>>   }
>
> >>>>>>   // and empty the array itself>   markerArray
= [];
>
> >>>>>>>   var url =
"/group/update_mapv3_circles";
> >>>>>>>   new Ajax.Request(url, {
> >>>>>>>     method: ''get'',
> >>>>>>>     onSuccess: function(response) {
> >>>>>>>       var sites = response.responseText;
> >>>>>>>       addCircles(sites, map, markerArray,
lineArray);
> >>>>>>>     }
> >>>>>>>   });
>
> >>>>>> I see nothing wrong. Does the addCircles function
expect a JSON
> >>>>>> object for the first param?  The only reason I can
think why this isn''t
> >>>>>> working
> >>>>>> is a type mismatch.
>
> >>>>>>> If i do an alert(response.responseText) the
alert will show up and
> >>>>>>> display the contents of the
@mapped_sites.to_json ( i am using
> >>>>>>> render :json => @mapped_sites.to_json in
the controller).
> >>>>>>> Please let me know if you see something i am
doing wrong.
> >>>>>>> Thanks for your help on this so far Jim.
>
> >>>>>>> sk
>
> >>>>>>> On Dec 9, 11:49 pm, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>>>>>> On Sat, Dec 10, 2011 at 3:56 AM, skrite
<sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >>>>>>>>> I am intrigued by this solution, Jim.
> >>>>>>>>> i have a couple of questions, as it
seems this is a cleaner way than
> >>>>>>>>> what I am trying to do.
> >>>>>>>>> The values that determine the circle
color are in the database, and
> >>>>>>>>> can change while the page is loaded.
This is why i need them to
> >>>>>>>>> update.
>
> >>>>>>>> i''ll still go with my suggestion
earlier.  To update the colors, just
> >>>>>>> update
> >>>>>>>> the sites variable after completing the
ajax request and then call
> >>>>>>>> addCircles
>
> >>>>>>>> your ajax call may look like the following
(this is totally untested :D)
>
> >>>>>>>> $.ajax({
> >>>>>>>>   url:
your_url_here_that_returns_json_equivalent_of_@mapped_sites,
> >>>>>>>>   success: function(data) {
> >>>>>>>>     addCircles(data);
> >>>>>>>>   }
>
> >>>>>>>> });
> >>>>>>>>> So, somehow i still need to go to the
server for that. I guess i am
> >>>>>>>>> missing the part about how to get the
@mapped_sites variable to the
> >>>>>>>>> controller and back again to the page
to rebuild the circles.
> >>>>>>>>> Thanks for your time on this.
> >>>>>>>>> sk
>
> >>>>>>>>> On Dec 9, 9:48 am, Jim Ruther Nill
<jvn...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>>>>>>>> On Fri, Dec 9, 2011 at 11:04 PM,
skrite <sh...-Qz7pPmdSRn+sTnJN9+BGXg@public.gmane.org> wrote:
> >>>>>>>>>>> Hey, thanks for these links,
very helpful.
> >>>>>>>>>>> -sk
>
> >>>>>>>>>>> On Dec 8, 7:49 pm,
"L.Karthikeyan"
<logkart...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >>>>>>>>>>>> Hi,
>
> >>>>>>>>>>>>       For this you need to
use rjs Ajax request. Please refer the
> >>>>>>>>>>>> following links, you will
get an idea.
>
> >>>>>>>>>>>>
1.http://railscasts.com/episodes/43-ajax-with-rjs?autoplay=true,
> >>>>>>>>>>>> 2.
>
>>>>>>>>>http://railscasts.com/episodes/229-polling-for-changes?autoplay=true
>
> >>>>>>>>>> one more option is to keep
@mapped_sites to a javascript variable so
> >>>>>>> you
> >>>>>>>>>> dont have to use ajax.  you might
also want to move the makeMarker
>
> ...
>
> read more »
-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

Rails - Dec 2011 - how to use javascript to update markers on Google maps

how to use javascript to update markers on Google maps

Re: how to use javascript to update markers on Google maps

Re: how to use javascript to update markers on Google maps

Re: Re: how to use javascript to update markers on Google maps

Re: how to use javascript to update markers on Google maps

Re: Re: how to use javascript to update markers on Google maps

Re: how to use javascript to update markers on Google maps

Re: Re: how to use javascript to update markers on Google maps

Re: how to use javascript to update markers on Google maps

Re: Re: how to use javascript to update markers on Google maps

Re: how to use javascript to update markers on Google maps

Re: Re: how to use javascript to update markers on Google maps

Re: how to use javascript to update markers on Google maps

Re: Re: how to use javascript to update markers on Google maps

Re: how to use javascript to update markers on Google maps