4de81020cab904a53f56199162ed5ef1b81f16e1.svn-base 1.2 KB

123456789101112131415161718192021222324252627282930313233
  1. <!DOCTYPE html>
  2. <html>
  3. <meta charset="UTF-8">
  4. <meta name="viewport" content="width=device-width, initial-scale=1">
  5. <title>瓦片图层与地理投影 - 百度投影底图</title>
  6. <style type="text/css">
  7. html,body{margin:0px;height:100%;width:100%}
  8. .container{width:100%;height:100%}
  9. </style>
  10. <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/maptalks@0.41.1/dist/maptalks.css">
  11. <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/maptalks@0.41.1/dist/maptalks.min.js"></script>
  12. <body>
  13. <div id="map" class="container"></div>
  14. <script>
  15. var map = new maptalks.Map('map', {
  16. center: [105.08052356963802, 36.04231948670001],
  17. zoom: 5,
  18. minZoom:1,
  19. maxZoom:19,
  20. spatialReference:{
  21. projection : 'baidu'
  22. },
  23. baseLayer: new maptalks.TileLayer('base', {
  24. 'urlTemplate' : 'http://online{s}.map.bdimg.com/onlinelabel/?qt=tile&x={x}&y={y}&z={z}&styles=pl&scaler=1&p=1',
  25. 'subdomains' : [0,1,2,3,4,5,6,7,8,9],
  26. 'attribution' : '&copy; <a target="_blank" href="http://map.baidu.com">Baidu</a>'
  27. })
  28. });
  29. </script>
  30. </body>
  31. </html>