Interactive demo of https://github.com/migurski/d3map/tree/e42c04d5
xxxxxxxxxx
<html lang="en">
<head>
<meta charset="utf-8" />
<title>New Newness</title>
<script src="https://d3js.org/d3.v2.min.js"></script>
<script src="Grid.min.js"></script>
<style title="text/css">
<!--
#map
{
border: 1px solid pink;
width: 100%;
height: 350px;
position: relative;
overflow: hidden;
margin: 0;
padding: 0;
}
body
{
overflow: hidden;
}
img.tile,
div.tile
{
display: block;
position: absolute;
margin: 0;
padding: 0;
border: 0;
-webkit-transform-origin: 0px 0px;
}
-->
</style>
</head>
<body>
<div id="map"></div>
<script type="application/javascript">
<!--
/*
var map = makeDivMap(document.getElementById('map'), 1582, 656, 12);
*/
var map = makeImgMap(document.getElementById('map'),
'https://otile1.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.jpg',
1582, 656, 12);
map.redraw();
//-->
</script>
</body>
</html>
Modified http://d3js.org/d3.v2.min.js to a secure url
https://d3js.org/d3.v2.min.js