javascript - Google Earth API Draw many placemarks without crashing the browser -
i using google earth api , want draw multiple placemark (points , polygons) on map @ once. actual scenario user have list of , can click them draw them 1 1 or click draw button start drawing 3000 placemarks. problem after few second browser/plugin crashes or prompts user stop plugin executing.
this example code made :
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en""http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <head> <title>many points test!</title> <script src="http://www.google.com/jsapi?key=abqiaaaawbkbzlyhsmtcwxbtcjbgbrszhs7k5svaudm8ua-xxy_-2dywmxqmhnagaawto7l1fe1-amhuqxilxw"></script> <script> google.load("earth", "1"); var ge = null; function init() { google.earth.createinstance("map3d", initcallback, failurecallback); } function initcallback(object) { ge = object; ge.getwindow().setvisibility(true); // current view. var lookat = ge.getview().copyaslookat(ge.altitude_relative_to_ground); // set new latitude , longitude values. lookat.setlatitude(37.802); lookat.setlongitude(-122.448425); lookat.setrange(1000); // update view in google earth. ge.getview().setabstractview(lookat); addpoints(1); } function failurecallback(object) { } function addpoints(num) { for(var = 0; < num; i++) { var x = "37.802" + i.tostring(); var kmlstring = '' + '<?xml version="1.0" encoding="utf-8"?>' + '<kml xmlns="http://www.opengis.net/kml/2.2">' + '<document>' + ' <placemark>' + ' <name>placemark kml string</name>' + ' <point>' + ' <coordinates>-122.448425,'+x+',0</coordinates>' + ' </point>' + ' </placemark>' + '</document>' + '</kml>'; var kmlobject = ge.parsekml(kmlstring); ge.getfeatures().appendchild(kmlobject); } } </script> </head> <body onload='init()' id='body'> <center> <div id='map3d' style='border: 1px solid silver; height: 600px; width: 800px;'></div> <input onclick="addpoints(10000)" value="add many points" type="button" /> </center> </body> </html> anyone know how can keep browser responsive or load placemarks in asynchronous way?
what seemed solve pausing between every placemark drew using settimeout :
function addpoints(arr, index) { var end = math.min(arr.length, index + 1); (var = index; < end; i++) { var kmlobject = ge.parsekml(arr[i]); ge.getfeatures().appendchild(kmlobject); document.getelementbyid('done').innerhtml = i; } if (end != arr.length) { settimeout(function () { addpoints(arr, end); }, 1); } else { alert('done'); } } addpoints(arr, 0); /* function call */
Comments
Post a Comment