Google maps v3, JSON, Objects and Opera

I am using http://maps.google.com/maps/api/js?sensor=false to retrieve latitude and longitude for address.

While retrieving the data from google, I store the lats and lngs into arrays myLat and myLng.

The end user enters addresses into a textarea along with the names of the buildings which are also stored into their own arrarys schoolAddressArray and schoolNameArray.

I place the results in a div called results --

document.getElementById("results")

Then I take the constructed string and use eval to convert it into a "JSON like" object.

PHP start

global $browser;

if(strpos($_SERVER["HTTP_USER_AGENT"], "Opera") !== FALSE)
{ 
    $browser = "opera";
}
if(strpos($_SERVER["HTTP_USER_AGENT"], "MSIE") !== FALSE)
{ 
    $browser = "msie";
}
if(strpos($_SERVER["HTTP_USER_AGENT"], "Firefox") !== FAL开发者_运维技巧SE)
{ 
    $browser = "ff";
}
if(strpos($_SERVER["HTTP_USER_AGENT"], "Safari") !== FALSE)
{ 
    $browser = "safari";
}
echo'
<script type="text/javascript">
<!--
var $whichBrowser = "'; echo $browser; echo'";
-->
</script>
';

PHP end

This is where the JavaScript starts

var strlen = tempVar.length;
var myNewTempVar = tempVar.slice(0,strlen-2)+']';
document.getElementById("results").innerHTML = myNewTempVar;
if($whichBrowser == "msie")
{
    //alert(document.getElementById("results").childNodes[0].nodeValue);
    markers = window.eval(document.getElementById("results").childNodes[0].nodeValue);
}
else if($whichBrowser == "opera")
{
    //markers = window.eval([getProperty(tempVar.slice(1,strlen-2))]);
    //alert(markers);
    //markers = [{ lat: 34.0878234, lng: -118.1543285, name: "1 school"}, { lat: 34.071239, lng: -118.1506133, name: "2 school"}, { lat: 34.1015362, lng: -118.1328816, name: "3 school"}, { lat: 34.098139499, lng: -118.1168382, name: "4 school"}, { lat: 34.0751855, lng: -118.1381771, name: "5 school"}, { lat: 34.0856624, lng: -118.1345840, name: "6 school"}, { lat: 34.0951319, lng: -118.1421722, name: "7 school"}, { lat: 34.0760016, lng: -118.1281349, name: "8 school"}, { lat: 34.0621694, lng: -118.1291052, name: "9 school"}, { lat: 34.0583261, lng: -118.1563075, name: "10 school"}, { lat: 34.046435, lng: -118.1524630, name: "11 school"}, { lat: 34.054128899, lng: -118.1280777, name: "12 school"}];
    for(var myX=0;myX<myLat.length;myX++)
    {
        markers.push(["{ lat: "+myLat[myX]+",  lng: "+myLng[myX]+",  name: "+schoolNameArray[myX]+"}"]);
    }
    alert(markers);
}
else
{
    markers = eval('('+myNewTempVar+')');
}

JavaScript End

As you can see, I use PHP's

strpos($_SERVER["HTTP_USER_AGENT"]

to figure out what browser is being used by the end user followed by echoing some javascript to set the variable $whichBrowser. This has worked for me since early 2000s -- BTW, I don't know what to call that. The 90s are the 90s. Are these the 10s? The 0s?

Anyways, the code for IE, FF and Safari work fine, but I have tried everything that I could think of with Opera and it just will not see markers as an object.

I have copied the constructed string from the results div and hard coded it to see if it worked at all in opera, which it does with no errors at all.

I have also tried:

for(index in myLat)
{
 markers[index].lat = myLat[index];
 markers[index].lng = myLng[index];
 markers[index].name = schoolNameArray[index];
}

I have received errors ranging from cannot convert markers[index] into an object to Uncaught exception: RangeError: Maximum recursion depth exceeded

Here is the test data that I am using:

2821 W. Commonwealth Ave., Alhambra, CA
2001 S. Elm St., Alhambra, CA
110 W. McLean St., Alhambra, CA
100 S. Granada Ave., Alhambra, CA
1603 S. Marguerita Ave., Alhambra, CA
409 S. Atlantic Blvd., Alhambra, CA
301 N. Marengo Ave., Alhambra, CA
509 W. Norwood Pl., Alhambra, CA
120 S. Ynez Ave., Monterey Park, CA
400 Casuda Canyon Dr., Monterey Park, CA
1701 Brightwood St., Monterey Park, CA
650 Grandridge Ave., Monterey Park, CA

Here's the link to my test server -- http://kronusproductions.com/mycarpaysme_ajax/test_street_view13.php

As you can see there are no errors reported in IE, Safari and FF, but Opera is a different ball game.

Some warnings in Safari for the svgs returned by google and some css warnings in FF, but 0 errors. IE complains when an address is not returned by google, but I will enter some kind of try and catch code for google after fixing this issue in Opera.

I have tried also sending the string to a function and return the evaluation, but nothing has worked so far.

Thanks in advance and I hope I have followed all the rules to posting to this forum.

---

Any modern browser will have its own JSON parser:

JSON.parse('{"hello": ".jpg"}')

Use that and NOT eval

var points = {filled: false};
if(typeof(JSON) != undefined){
   points = JSON.parse(jsonString);
   points.filled = true;
}else{
   alert('Come back after you upgrade your janky old browser');
}
if(points.filled){//get the data you want here

No need for browser detection, either. Well, unless you really want to get those IE6 users.

---

this

for(index in myLat){
 markers[index].lat = myLat[index];
 markers[index].lng = myLng[index];
 markers[index].name = schoolNameArray[index];
}

should be

for(var i=0;i<myLat.length;i++){
     markers.push({
        lat: myLat[i],
        lng: myLng[i],
        name: schoolNameArray[i]
    });
}