Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Google Maps API 3 -- Polyline breaks in IE

Posted on 2011-03-25
3
Medium Priority
?
927 Views
Last Modified: 2012-06-27
Experts,

I'm sorry to be part of the long line of "It Doesn't Work in IE" but here goes.

I'm trying to add a polyline to a pair of latlng points.  Works great in Chrome, Opera and FF.

In IE 8 i receive the following:
******************
Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Win64; x64; Trident/4.0; .NET CLR 2.0.50727; SLCC2; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; AskTbARS/5.8.0.12304)
Timestamp: Fri, 25 Mar 2011 08:23:59 UTC

Message: Arg: Fraction out of range (0 to 1 allowed)
Line: 8
Char: 202
Code: 0
URI: http://maps.gstatic.com/intl/en_ca/mapfiles/api-3/4/6a/main.js
**************
The map and the markers seem to render correctly, sort of, but the polyline is definitely missing and any attempt to zoom breaks the thing entirely.

I've searched for solutions and tried different header settings, all of which have no effect.

I need this proof of concept working on IE by Thursday next week

Can you point me to a solution?

Capt

PS -- I'll supply further info should you need it.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
		"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
		<html xmlns="http://www.w3.org/1999/xhtml"
		xmlns:v="urn:schemas-microsoft-com:vml"> <head><style type="text/css">v\:* { behavior:url(#default#VML); }</style><meta http-equiv=""X-UA-Compatible" content="IE=EmulateIE7" ><meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

Open in new window

0
Comment
Question by:Glen Gibb
  • 2
3 Comments
 
LVL 9

Accepted Solution

by:
EZFrag earned 1500 total points
ID: 35214103
Hi there,

Is there any chance that you can provide your source code?

Regards,
EZFrag
0
 

Author Comment

by:Glen Gibb
ID: 35215270
Thanks for your reply.  Here's the source code.  

I found the answer in a Google Forum -- apparently the "Fraction was caused by a strokeOpacity setting that was neither 1 nor 0.

The example that I was working from set the original strokeOpacity value to 5, which IE totally choked on.  The other browsers handled it just fine.

As soon as the value changed, the error cleared right up and I had the desired PolyLine.

Tnx,

Capt
// add polyline points for line ...
					if (eqType == 1)
					{
						$.ajax(
						{
							type: 'get',
							url: 'ajax_end_points.php',
							contentType: 'html; charset=utf-8',
							dataType: 'json',
							data: 'eqId=' + items.equipmentPK,
							async: false,
							success: function(data)
							{
								endLat = data[0] * 1;
								endLon = data[1] * 1;
								var pts = [
									new google.maps.LatLng(startLat, startLon),
									new google.maps.LatLng(endLat, endLon)
								];
								//alert(pts);
								// IE error: strokeOpacity must be 1 (Arg: fraction)  ...
								var polyln = new google.maps.Polyline( {
									path: pts,
									strokeColor: '#000',
									strokeOpacity: 1,
									strokeWeight: 5
								});
								// connect the points ...
								polyln.setMap(map);
							}
						});
					}

Open in new window

0
 

Author Closing Comment

by:Glen Gibb
ID: 35215281
See my post with the actual answer.
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

A while back, I ran into a situation where I was trying to use the calculated columns feature in SharePoint 2013 to do some simple math using values in two lists. Between certain data types not being accessible, and also with trying to make a one to…
Ready to get certified? Check out some courses that help you prepare for third-party exams.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
This Micro Tutorial will demonstrate how nuggets on the Web are formatted by using Chrome Developer Tools. These tools would not only view the site's CSS but it can also modify it and save the CSS to use on your own site.
Suggested Courses

916 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