javascript - IndexedDB error: Uncaught DataCloneError: Failed to execute 'put' on 'IDBObjectStore': An object could not be cloned -


i using google maps api along html 5 geolocation api display position marker on map. once marker displayed have simple on marker double click function saves new marker current position using indexeddb. goes until object stored, recieve message "uncaught datacloneerror: failed execute 'put' on 'idbobjectstore': object not cloned." in console. code follows:

        function initialize() {           var mapproperties = { // set maps properties             center:new google.maps.latlng(55.8580,-4.2590),             zoom:8,             maptypeid:google.maps.maptypeid.roadmap           };                var map=new google.maps.map(document.getelementbyid("map-overview"),mapproperties);   //display map in map-overview div                   function nogeolocation(e) {   //a function handle users not have geolocation           if (e) {             var content = 'error: unfortunately geolocation service failed.';           } else {             var content = 'error: sorry, web browser doesn\'t support geolocation.';           }              var options = { //error options             map: map,             position: new google.maps.latlng(60, 105), //set new position on error             content: content    //display error message           };            var infowindow = new google.maps.infowindow(options);            map.setcenter(options.position);            }                //using html5 geolocation           if(navigator.geolocation) {             navigator.geolocation.getcurrentposition(function(position) {               var position = new google.maps.latlng(position.coords.latitude,                                                position.coords.longitude);                    var contentstring = "here current location!" + "<button onclick='mybtn()'>save</button>"               var infowindow = new google.maps.infowindow({               content: contentstring           });             var marker = new google.maps.marker({               position: position,               map: map,               title: 'my house'           });                 google.maps.event.addlistener(marker, 'click', function() {             infowindow.open(map,marker);           });          var db;          function indexeddbok() {             return "indexeddb" in window;         }          google.maps.event.addlistener(marker, 'dblclick', function() {          alert("dbl click");          console.log(position);                if(!indexeddbok) return;              var openrequest = indexeddb.open("idarticle_people",1);              openrequest.onupgradeneeded = function(e) {                 var thisdb = e.target.result;                  if(!thisdb.objectstorenames.contains("people")) {                     thisdb.createobjectstore("people");                 }             }              openrequest.onsuccess = function(e) {                 console.log("running onsuccess");                  db = e.target.result;                 var transaction = db.transaction(["people"],"readwrite");             var store = transaction.objectstore("people");              //define marker              var marker = {              position: position,              map: map,             title: 'new marker'          }          console.log(marker);          console.log("about perform add");             //perform add             var request = store.put(marker,1);              console.log("added");              request.onerror = function(e) {                 console.log("error",e.target.error.name);                 //some type of error handler             }              request.onsuccess = function(e) {                 console.log("woot! did it");             }                }              openrequest.onerror = function(e) {                 //do error             }              });                            map.setcenter(position);             }, function() {               nogeolocation(true); // refers nogeolocation function             });           } else {             // if user's browser doesn't support geolocation             nogeolocation(false);           } //end of html5 geolocation                     } // end of function initializes google maps           google.maps.event.adddomlistener(window, 'load', initialize);   //on page load, execute initialize() 

marker can't cloned because object stored in map-property contains reference domnode(#map-overview), can't cloned (see:things don't work structured clones ).

remove map-property, not re-usable @ because google.maps.map-instance not exist when retrieve marker later.


Comments

Popular posts from this blog

java - Unable to make sub reports with Jasper -

sql - The object name contains more than the maximum number of prefixes. The maximum is 2 -