putting markers on polylines

2,334 views
Skip to first unread message

fireofhellx

unread,
Apr 28, 2011, 12:23:37 PM4/28/11
to google-map...@googlegroups.com
right i have made a number of polylines but want to know how i would go about adding a marker to them every 10 meters?
ive been looking around and havent found anything that orks

geoco...@gmail.com

unread,
Apr 28, 2011, 12:28:04 PM4/28/11
to Google Maps JavaScript API v3

fireofhellx

unread,
Apr 28, 2011, 12:44:33 PM4/28/11
to Google Maps JavaScript API v3
yes that is what i need but there is a lot going on in that script
do i just need to get the length of my polylines then put markers on
at a set distance i have found this for calculating the length

google.maps.LatLng.prototype.kmTo = function(a){
var e = Math, ra = e.PI/180;
var b = this.lat() * ra, c = a.lat() * ra, d = b - c;
var g = this.lng() * ra - a.lng() * ra;
var f = 2 * e.asin(e.sqrt(e.pow(e.sin(d/2), 2) + e.cos(b) *
e.cos(c) * e.pow(e.sin(g/2), 2)));
return f * 6378.137;
}





google.maps.Polyline.prototype.inKm = function(n){
var a = this.getPath(n), len = a.getLength(), dist = 0;
for(var i=0; i<len-1; i++){
dist += a.getAt(i).kmTo(a.getAt(i+1));
}
return dist;
}

but it dosent seem to work

On Apr 28, 5:28 pm, "geocode...@gmail.com" <geocode...@gmail.com>
wrote:
> On Apr 28, 9:23 am, fireofhellx <homem...@aol.com> wrote:
>
> > right i have made a number of polylines but want to know how i would go
> > about adding a marker to them every 10 meters?
> > ive been looking around and havent found anything that orks
>
> Does this help:http://groups.google.com/group/google-maps-js-api-v3/browse_frm/threa...
>
>   -- Larry

Esa

unread,
Apr 28, 2011, 1:44:16 PM4/28/11
to Google Maps JavaScript API v3


On Apr 28, 7:44 pm, fireofhellx <homem...@aol.com> wrote:
> yes that is what i need but there is a lot going on in that script
> do i just need to get the length of my polylines then put markers on
> at a set distance i have found this for calculating the length

> but it dosent seem to work

I been using those methods a lot and they work fine for me. The first
one calculates distance between two LatLng points. The second one
makes use of that and iterates through a polyline segments and returns
a cumulated length. Actually I wrote them but never documented them.

If you have a polyline called poly, you can test it by:

alert(poly.inKm());

By using those, you can create a 'milestone function'. See
getPointAtDistance() function in Mike Williams' v2 EPoly library.
http://econym.org.uk/gmap/epoly.htm

The polyline length is measured to the last vertex before milestone
and to the first vertex after milestone. The last part is calculated
by interpolation.

Esa

unread,
Apr 28, 2011, 1:51:17 PM4/28/11
to Google Maps JavaScript API v3
Actually you should use the geometry library functions that were
introduced to api recently
http://code.google.com/apis/maps/documentation/javascript/reference.html#spherical

Still you have to write the milestone function but geometry library
provides you interpolate() function to make it a little bit easier.

fireofhellx

unread,
Apr 28, 2011, 1:59:02 PM4/28/11
to google-map...@googlegroups.com
ok thank you very much for your help its alot clearer what i need to do thanks

Danny

Esa

unread,
Apr 28, 2011, 2:10:37 PM4/28/11
to Google Maps JavaScript API v3
Ah, sorry. It took me this long to realize that Larry already ported
EPoly to v3.
http://www.geocodezip.com/scripts/v3_epoly.js

fireofhellx

unread,
Apr 28, 2011, 2:16:32 PM4/28/11
to google-map...@googlegroups.com
ummm ive linked the epoly.js file (the updated one)but cant seem to get the functions to work?

my polyline is called roadpath

ive written var collectables = roadpatht.GetPointsAtDistance(5.00);

but it stops at this line 

Esa

unread,
Apr 28, 2011, 2:25:31 PM4/28/11
to Google Maps JavaScript API v3
That's a marker after each five meters.

fireofhellx

unread,
Apr 29, 2011, 11:58:20 AM4/29/11
to google-map...@googlegroups.com
yeh i need to make markers a short distance apart prob more like 15 meters apart but i cant seem to get GetPointsAtDistance to work so im a bit stuck here is what i have

my polyline

var roadpath = new google.maps.Polyline({
    path:latlng,
     strokeColor: "#FF0000",
     strokeOpacity: 1.0,
        strokeWeight: 2
});


                                 roadpath.setMap(map);



var pathmark = roadpath.GetPointsAtDistance(15.00);

then i need to use the value of pathmark to place my markers right?
however my script stops when it hits var pathmark = roadpath.GetPointsAtDistance(15.00); and im not sure why any suggestion?

geoco...@gmail.com

unread,
Apr 29, 2011, 12:08:52 PM4/29/11
to Google Maps JavaScript API v3
On Apr 29, 8:58 am, fireofhellx <homem...@aol.com> wrote:
> yeh i need to make markers a short distance apart prob more like 15 meters
> apart but i cant seem to get GetPointsAtDistance to work so im a bit stuck
> here is what i have

It works for me. If you post a link to your map that exhibits the
problem, and time permits, I will take a look and see if I can see
what you are doing differently.

-- Larry

fireofhellx

unread,
Apr 29, 2011, 12:14:04 PM4/29/11
to google-map...@googlegroups.com
ok ty from line 341 and below is the polyline stuff 
i think u may have looked my site before for a different question a week or so back

geoco...@gmail.com

unread,
Apr 29, 2011, 12:30:40 PM4/29/11
to Google Maps JavaScript API v3
On Apr 29, 9:14 am, fireofhellx <homem...@aol.com> wrote:
> ok ty from line 341 and below is the polyline stuffhttp://dannyw.instantfreesite.net/game.html
> i think u may have looked my site before for a different question a week or
> so back


And this is still true:
http://groups.google.com/group/google-maps-js-api-v3/msg/1cb5b623947d56a9

Your map doesn't work for me. I don't see any polylines, makes it
hard to help on your problem.

-- Larry

fireofhellx

unread,
Apr 29, 2011, 12:35:43 PM4/29/11
to google-map...@googlegroups.com
ok that odd you need to let it use your location because thats how i have designed it 
if u let it use your position you should see the polyline 
i know my code is a mess this is the first big project ive done using javascript in this manor 

Rossko

unread,
Apr 29, 2011, 2:06:07 PM4/29/11
to Google Maps JavaScript API v3
> ok that odd you need to let it use your location because thats how i have
> designed it

That's up to you of course, but your website will not be useable by
people who don't behave the way you tell them.

The problem I can actually see is that you are trying to extend the
Google Maps API with the epoly extension before the API has been
loaded. Load the API before epoly script.

fireofhellx

unread,
Apr 29, 2011, 3:03:53 PM4/29/11
to google-map...@googlegroups.com
ah i see thank you very much for your help

just to note this project is a university project into the nature of user interaction with mobile apps, and to what extent a user is willing to physically interact within the really world to play within a virtual one, hence the location tracking and the nature of my design 

thank you for your help

fireofhellx

unread,
Apr 29, 2011, 3:34:57 PM4/29/11
to google-map...@googlegroups.com
this may seem like a silly question but when dose the API finish loading? because i can get markers and polylines to show i thought once you had made the map the api was loaded ?

Rossko

unread,
Apr 29, 2011, 6:28:49 PM4/29/11
to Google Maps JavaScript API v3
> this may seem like a silly question but when dose the API finish loading?

It's not about that, it's about
<script src="javascript/v3_epoly.js" type="text/javascript"></
script>
<script type="text/javascript" src="http://maps.google.com/maps/api/
js?sensor=true"></script>
you can't add an API extension before you have even requested the API
to be extended

> because i can get markers and polylines to show

I can't

fireofhellx

unread,
Apr 29, 2011, 7:34:34 PM4/29/11
to google-map...@googlegroups.com
oh right i see what u mean sorry im still very new to this 

fireofhellx

unread,
Apr 29, 2011, 7:57:40 PM4/29/11
to google-map...@googlegroups.com
ty very much it was the fact i have the ve epoly loading before the api works perfect now you have been a big help
Reply all
Reply to author
Forward
0 new messages