stamen/maps.stamen.com

Tiles not loading in Chrome

stevenpaulr opened this issue · 4 comments

stevenpaulr commented

Website works fine in Edge and Safari, but the tiles do not load in chrome.

https://wyotelassn.org/broadband-overview-page/

almccon commented

I think this is the known problem that we do not support HTTPS at the tile.stamen.com URL. To use HTTPS, you need to load our tiles directly from our CDN Fastly. So instead of http://tile.stamen.com, you use https://stamen-tiles-{S}.a.ssl.fastly.net. You can scroll down to the bottom of the page at http://maps.stamen.com/ for more info.

Let us know if this doesn't solve your problem.

stevenpaulr commented

I'm already using the SSL from Fastly

function radmap_enqueue(){ wp_enqueue_style( 'Leaflet', "https://unpkg.com/leaflet@1.6.0/dist/leaflet.css" ); wp_enqueue_style( 'RadMapStyle', plugins_url("radmap.css", __FILE__)); wp_enqueue_script( 'Leaflet', 'https://unpkg.com/leaflet@1.6.0/dist/leaflet.js', array(), '1.6.0'); wp_enqueue_script( 'Stamen', "https://stamen-maps.a.ssl.fastly.net/js/tile.stamen.js?v1.3.0");

which turns into:

<script type='text/javascript' src='https://stamen-maps.a.ssl.fastly.net/js/tile.stamen.js?v1_3_0&#038;ver=5.6' id='Stamen-js'></script>

ebrelsford commented

@stevenpaulr The site is loading tiles from https://*.tile.stamen.com/... which is not the correct domain:

image

You're best off using a Leaflet tileLayer with the proper domain name: https://stamen-tiles.a.ssl.fastly.net/terrain/{z}/{x}/{y}.jpg, for example.

stevenpaulr commented

Awesome, I replaced:
var layer = new L.StamenTileLayer(\"terrain\");
with
var layer = new L.tileLayer('https://stamen-tiles.a.ssl.fastly.net/terrain/{z}/{x}/{y}.jpg');
and it solved my problem. It would be nice if the version of the javascript hosted on the SSL CDN would reference the SSL CDN version of the tiles. Thanks for the help.