API map inicial sem o google
by edgardleal
HTML
<div class="map-frame map-bahia"
style="background-size : 200px 200px">
<a id="mutuipe" title="MutuĂpe <br>" href="#" class="map-indicator" style="top: 15px; left : 20px;"></a>
</div>
CSS
.map-bahia{
background-image : URL('http://www.baixarmapas.com.br/wp-content/uploads/mapa-estado-bahia.jpg');
}
.map-frame{
width : 200px;
height : 200px;
border : solid 1px;
margin-left : 20px;
margin-top : 30px;
}
.map-indicator{
position : relative;
border-radius : 5px;
background-color : red;
box-shadow : 0px 0px 3px /* inset */ yellow;
display : block;
width : 10px;
height : 10px;
}
JavaScript
var original = {
view : {
width : 200,
height: 200
},
map : {
center : {
lat : -12.579738,
lng : -41.7007272
}
},
bahiaTop : {
lat : 8.5,
lng : 39.36
},
delta : 1000000,
lat : -13.2252008,
lng : -39.5051517
};
original.latitude = original.lat * original.delta;
original.longitude= original.lng * original.delta;
var $mutuipe = $('#mutuipe');