CINXE.COM
Mapv - Gallery
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Mapv - Gallery</title> <meta name="keywords" content="Mapv,数据可视化,canvas,地图可视化,百度慧眼,大数据,轨迹,定位"/> <meta name="description" content="Mapv 是一款基于百度地图的大数据可视化开源库,可以用来展示大量的点、线、面的数据,每种数据也有不同的展示类型,如直接打点、热力图、网格、聚合等方式展示数据。" /> <style type="text/css"> html, body { margin: 0; padding: 0; } .boxContainer { } .box { width: 265px; height: 265px; background-size: 400px 400px; background-repeat:no-repeat; background-position: center;center; float: left; } </style> <script type="text/javascript" src="//apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script> <link href="index/css/base.css" rel="stylesheet" /> <link href="index/css/index.css" rel="stylesheet" /></head> </head> <body> <div class="nav"> <div class="nav-brand"> <a href="./"> <img src="index/images/logo_new.png" class="nav-logo" /> </a> </div> <ul class="nav-li"> <li> <a href="./">首页</a></li> <li> <a href="gallery.html">Gallery</a></li> <li> <a target="_blank" href="examples/">Demo</a></li> <li> <a href="https://github.com/huiyan-fe/mapv/blob/master/API.md">API</a></li> <!-- <li> <a href="/online">Online</a></li> --> <li> <a target="_blank" href="https://github.com/huiyan-fe/mapv#readme">GITHUB</a></li> <li> <a href="./v1/">V1</a></li> </ul> </div> <!-- an transparent bar, so that we can scroll the page --> <div style="position: fixed; width: 10px; top:0; right:0; bottom:0; background: red; z-index: 10; opacity: 0"></div> <div class="boxContainer"> </div> <script type="text/javascript" src="examples/js/config.js"></script> <script type="text/javascript"> var gridWidth = 256; window.addEventListener('resize', resize); var data = config.demos; var html = []; for (var i = 0; i < data.length; i++) { var item = data[i]; html.push('<a class="index" href="examples/#' + item.url + '"><div class="box" style="background-image:url(examples/pics/' + item.pic + ')"></div></a>'); } $('.boxContainer').html(html.join('')); function resize() { var count = Math.floor($(window).width() / gridWidth); var width = $(window).width() / count; $('.box').width(width); } resize(); </script> <div style="display:none;"> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "//hm.baidu.com/hm.js?0d1a62942662d252f0aea2b6f85c7f3d"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> </div> </body> </html>