Solved

Google Maps How do I get the mid point of a polyline?

Posted on 2008-06-19
3
486 Views
Last Modified: 2008-06-19
How would I caculate the mid point of the two points on the map point A and point B and place a marker for the mid point?

Here is the code I am working with.  A code snippit
it would be greatly appericated as I suck at math and would not know how to incorperate it into what I already have.

The points are being pulled from the database here is the link to the map and points

http://www.eyeglasses123.com/maps/map.php  Map
http://www.eyeglasses123.com/maps/genxml.php points xml


Thanks in advance


 
<script type="text/javascript">

    var geocoder;

    var map;

    var gmarkers = [];

    var lines = [];

    geocoder = new GClientGeocoder();
 

    

    //<![CDATA[
 

    var iconBlue = new GIcon(); 

    iconBlue.image = 'http://www.eyeglasses123.com/maps/mm_20_blue.png';

    iconBlue.shadow = 'http://www.eyeglasses123.com/maps/mm_20_shadow.png';

    iconBlue.iconSize = new GSize(12, 20);

    iconBlue.shadowSize = new GSize(22, 20);

    iconBlue.iconAnchor = new GPoint(6, 20);

    iconBlue.infoWindowAnchor = new GPoint(5, 1);
 

    var iconRed = new GIcon(); 

    iconRed.image = 'http://www.eyeglasses123.com/maps/mm_20_red.png';

    iconRed.shadow = 'http://www.eyeglasses123.com/maps/mm_20_shadow.png';

    iconRed.iconSize = new GSize(12, 20);

    iconRed.shadowSize = new GSize(22, 20);

    iconRed.iconAnchor = new GPoint(6, 20);

    iconRed.infoWindowAnchor = new GPoint(5, 1);
 

    var customIcons = [];

    customIcons["restaurant"] = iconBlue;

    customIcons["bar"] = iconRed;
 

    function load() {

      if (GBrowserIsCompatible()) {

        map = new GMap2(document.getElementById("map"));

        map.addControl(new GSmallMapControl());

        map.addControl(new GMapTypeControl());

        map.setCenter(new GLatLng(47.614495, -122.341861), 4);
 

        GDownloadUrl("http://www.eyeglasses123.com/maps/genxml.php", function(data) {

          var xml = GXml.parse(data);

          var markers = xml.documentElement.getElementsByTagName("marker");

          for (var i = 0; i < markers.length; i++) {

            showAddress(markers,0);

          }

        });

      }

    }
 

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

    

 function addToMap(point,marker_num,name,type,html,color) {
 

	// use a custom icon with letter A - Z

	var letter = String.fromCharCode("A".charCodeAt(0) + marker_num); 

// alert("addToMap("+marker_num+"="+letter+")");

        //  GLog.write(letter+j); 
 
 
 

	var myIcon = new GIcon(G_DEFAULT_ICON, "http://www.google.com/mapfiles/marker" + letter + ".png");

	

	myIcon.printImage = "http://maps.google.com/mapfiles/marker" + letter + "ie.gif"

	myIcon.mozPrintImage = "http://maps.google.com/mapfiles/marker" + letter + "ff.gif"

	

	var marker = new GMarker(point, {icon:myIcon});

        var infoWindowContent = "<b>"+name+"</b><br>type: "+type+"<br>"+html;

	GEvent.addListener(marker, "click", function() {

		marker.openInfoWindowHtml(infoWindowContent);

	});

	

	// save the info we need to use later for the side_bar

	gmarkers[marker_num] = marker;
 

        if (gmarkers.length >= 2) {

//          alert("add polyline - gmarkers.length="+gmarkers.length);

          var linepoints = [gmarkers[gmarkers.length-2].getPoint(), 

                            gmarkers[gmarkers.length-1].getPoint()];

//          alert(linepoints[0], linepoints[1]);

          var polyline = new GPolyline(linepoints,color, 2);

          map.addOverlay(polyline);

          

    

        }

          
 

	return marker;

}
 

    function showAddress(markers, marker_num) {

	    

	    

	    

	    

	    

	    

	    

	    

      var color = markers[marker_num].getAttribute("color");
 

      var name = markers[marker_num].getAttribute("name");

      var address = markers[marker_num].getAttribute("address");

      var type = markers[marker_num].getAttribute("type");

      var html = markers[marker_num].getAttribute("html");

      if (!html) { html = "there is no html attribute for this marker";}
 

      geocoder.getLatLng(address, 

        function(point) { 

	  if (!point) { 

	    alert(address + " not found"); 

	  } 

	  else { 

		map.setCenter(point, 4);

		var marker = addToMap(point, marker_num, name, type, html,color);

//                alert("gmarkers.length="+gmarkers.length);

		map.addOverlay(marker); 

	  }
 

          marker_num += 1;

          // note this is a recursive call, may cause problems if lots of markers

//          alert("markers.length="+markers.length+" marker_num="+marker_num);

          if (markers.length > marker_num) showAddress(markers, marker_num);

	});

	

	

    }
 

    //]]>

  </script>

Open in new window

0
Comment
Question by:Devain
  • 2
3 Comments
 
LVL 3

Accepted Solution

by:
McCoin earned 500 total points
ID: 21822965
I've never used google maps before, but I did a little research and found this link
http://groups.google.dm/group/Google-Maps-API/browse_thread/thread/a5545239760d7db9

It has some replies and some code examples, I hope this helps
0
 

Author Comment

by:Devain
ID: 21823073
lol thanks forgot I posted this
0
 
LVL 3

Expert Comment

by:McCoin
ID: 21823199
no problem,
no worries
0

Featured Post

What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

Join & Write a Comment

Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

747 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

9 Experts available now in Live!

Get 1:1 Help Now