| | |
| | | <head> |
| | | <meta charset="UTF-8"> |
| | | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| | | <title>天地图</title> |
| | | <title>Map Example</title> |
| | | <style> |
| | | /* 确保 body 和 html 充满整个视口 */ |
| | | /* 确保 body 和 html 充满整个视口 */ |
| | | html, body { |
| | | margin: 0; |
| | | padding: 0; |
| | | width: 100%; |
| | | height: 100%; |
| | | overflow: hidden; /* 防止滚动条出现 */ |
| | | } |
| | | /* 确保地图容器充满整个视口 */ |
| | | #mapDiv { |
| | | width: 100%; |
| | | height: 100%; |
| | | position: absolute; /* 保证地图全屏 */ |
| | | top: 0; |
| | | left: 0; |
| | | } |
| | | margin: 0; |
| | | padding: 0; |
| | | width: 100%; |
| | | height: 100%; |
| | | overflow: hidden; /* 防止滚动条出现 */ |
| | | } |
| | | /* 确保地图容器充满整个视口 */ |
| | | #mapDiv { |
| | | width: 100%; |
| | | height: 100%; |
| | | position: absolute; /* 保证地图全屏 */ |
| | | top: 0; |
| | | left: 0; |
| | | } |
| | | </style> |
| | | <script src="http://api.tianditu.gov.cn/api?v=4.0&tk=d8beed89b43160a9a185e5aff431f85d" |
| | | type="text/javascript"></script> |
| | | <!-- 引用本地的天地图 JS 文件 --> |
| | | <script src="js/tianditu.js"></script> |
| | | <!-- <script src="http://api.tianditu.gov.cn/api?v=4.0&tk=d8beed89b43160a9a185e5aff431f85d" |
| | | type="text/javascript"></script> --> |
| | | </head> |
| | | |
| | | <body> |
| | | <div id="mapDiv"></div> |
| | | <script src="js/map.js"></script> |
| | | <div id="mapDiv"></div> |
| | | |
| | | <script src="js/map.js"></script> |
| | | |
| | | </body> |
| | | |
| | | </html> |