openlayers 3 - Changes in a GeoJson file do not refresh on the map -


i create layer geojson file. made changes file , hope changes can reflected on map. map stays same.

i think should force map reload json file wonder how that.

i had same issue , how solved it:

consider using vector loader function handle fetching geojson files. i've had numerous caching issues not using vector loading function fetch geojson files , method below eliminated problem. example:

var utils = { refreshgeojson: function(source,url) {   var = date.now();   if (typeof url == 'undefined') {     url = source.geturl();   }   url += '?t=' + now; //add current time prevent browser caching   console.info('refreshgeojson url: ' + url);       this.getjson(url).when({     ready: function(response) {       var format = new ol.format.geojson();       var features = format.readfeatures(response, {         featureprojection: 'epsg:3857'       });       console.dir(features);       console.log(features.length);       source.addfeatures(features);       source.changed();     }      }); }, getjson: function(url) {       var xhr = new xmlhttprequest(),       when = {},       onload = function() {     console.log('xhr.status onload() ' + xhr.status);     if (xhr.status === 200) {      console.log('getjson() xhr: ');      console.dir(xhr);      console.log('getjson() xhr.response: ');      console.dir(xhr.response);               when.ready.call(undefined, json.parse(xhr.response));         }     if (xhr.status === 404) {       console.log('file not found! url: ' + url);       alert("file not found!\n" + url);     }       },       onerror = function() {         console.info('cannot xhr ' + json.stringify(url));       };   //console.log('getjson() - retrieve file url: ' + url);       xhr.open('get', url, true);       xhr.setrequestheader('cache-control', 'no-store');       xhr.onload = onload;       xhr.onerror = onerror;       xhr.send(null);       return {     when: function(obj) { when.ready = obj.ready; }     }; } };  var vectorloader = function(extent, resolution, projection) {   utils.refreshgeojson(this); }  var vectorsource = new ol.source.vector({     url: /path-to/myfile.geojson',     format: new ol.format.geojson({       defaultdataprojection :'epsg:3857'      }),     loader: vectorloader,     strategy: ol.loadingstrategy.all });

i have timed function calls vectorsouce.clear() before reloads data layer. calling .clear() fires vector loader function map layer.


Comments

Post a Comment

Popular posts from this blog

php - How to add and update images or image url in Volusion using Volusion API -

actually have store importing products store product data insert , update image or image url not insert , update. this xml code name datapro.txt. <products_joined> <productcode>3710_012t</productcode> <vendor_partno>eah5450silent/di/1gd3(lp)</vendor_partno> <productname>test product ta</productname> <hideproduct>n</hideproduct> <stockstatus>20</stockstatus> <lastmodified>1/5/2016 10:25:00 am</lastmodified> <lastmodby>2</lastmodby> <productweight>0.9</productweight> <productprice>100</productprice> <productmanufacturer>asus tek</productmanufacturer> <vendor_price>32.69</vendor_price> <numproductssharingstock>0</numproductssharingstock> <categoryids>107</categoryids> <producturl>http://tebkq.mvlce.servertrust.com/productdetails.asp?productcode=3710_012t</producturl>
Read more

javascript - IE9 error '$'is not defined -

Image
<!--[if lte ie 9]><html class="lte9"><![endif]--><!--[if gt ie 9]><html><![endif]--> <!--[if !ie]><!--> <html> <!--<![endif]--> blah blah <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="{{ asset('js/mypage.js') }}" type="text/javascript"></script> </body> </html> when load page, ie9 brings error '$' not defined . how can solve error? +++ mypage.js $(function(){ //when load page, //ie9 tag not moving. $(window).load(function() { $('div.mask').hide(); }); // when click , willshow show. //for not ie 9 if (!$('html').hasclass('lte9')) { var = $('ul.about > li > span.activebtn');
Read more