Skip to content

Instantly share code, notes, and snippets.

@ryanbaumann
Last active January 9, 2019 21:19
Show Gist options
  • Save ryanbaumann/c28a57618ecd60d23f59d24d91d016fd to your computer and use it in GitHub Desktop.
Save ryanbaumann/c28a57618ecd60d23f59d24d91d016fd to your computer and use it in GitHub Desktop.
Mapbox GL JS - Load map in Iframe sandbox with only allow-scripts

Test browser support for Sandbox Iframes and allow-scripts

  • If a Mapbox map is visable in this example, then your browser supports Web Workers!
  • If a Mapbox map is not visable, then check your console log - your browser has blocked web worker requests.

Known browsers that do not work:

  • IE11
  • Edge
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>Display a map</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<style>
body,
html {
width: 100%;
height: 100%;
margin: 0;
padding: 0
}
.second-row {
position: absolute;
top: 10px;
left: 0;
right: 0;
bottom: 0;
}
.second-row iframe {
display: block;
width: 100%;
height: 100%;
border: none;
}
</style>
</head>
<body>
<div class="second-row">
<iframe src="https://bl.ocks.org/ryanbaumann/raw/afc9f41f9c51121a21c5f1f5e831591c/1073a4974ecd4211280cc85eeda799a6e1001e2f/" sandbox="allow-scripts"></iframe>
</div>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment