C端蜂鸟地图
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

106 lines
4.1 KiB

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <title>地图</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <!-- <script src="./js/flexible.js"></script> -->
  7. <script src="./lib/fengmap.map.min.js"></script>
  8. <script src="./lib/fengmap.plugin.min.js"></script>
  9. <script src="https://s3.pstatp.com/cdn/expire-1-M/jquery/3.1.1/jquery.min.js"></script>
  10. <link rel="stylesheet" href="./style/fengmap.css">
  11. </head>
  12. <body>
  13. <div id="fengmap"></div>
  14. <!-- <div class="aabb">11231231</div> -->
  15. </body>
  16. <script>
  17. document.write("<s" + "cript type='text/javascript' src='./common/js/h5_game_common.js?version=" + Math.random() + "'></scr" + "ipt>");
  18. var map;
  19. let baseUrl = 'https://ctest.malls.iformall.com/C';
  20. // let baseUrl='/C';
  21. $.ajax({
  22. url: baseUrl + "/api/fengniaomap/getConfig",
  23. type: "GET",
  24. dataType: "json", //返回数据格式为json
  25. headers: {
  26. 'content-type': 'application/json',
  27. "token": "c34103fa-1d40-4ba7-95a4-28975e1d9143:789:wx-cuser",
  28. // "token":getQueryString('token')
  29. },
  30. success: function (res) {
  31. const data = res.data;
  32. let mapOptions = {
  33. appName: data.appName,
  34. key: data.appKey,
  35. mapID: data.mapId,
  36. container: document.getElementById("fengmap"),
  37. // mapURL: `/api/mapfile/${data.tenantId}/`,
  38. // themeURL: `/api/mapfile/${data.tenantId}/theme/`,
  39. mapURL: "./data/",
  40. themeURL: "./data/theme/",
  41. themeID: data.themeId,
  42. level: data.defaultFloor
  43. }
  44. let map = new fengmap.FMMap(mapOptions);
  45. // let mapOptions = {
  46. // appName: "金茂泊悦地图",
  47. // key: "cb54a3aa3a7066ec99b565363f63cb8c",
  48. // mapID: "1412326198669561858",
  49. // container: document.getElementById("fengmap"),
  50. // // mapURL: `/api/mapfile/${data.tenantId}/`,
  51. // // themeURL: `/api/mapfile/${data.tenantId}/theme/`,
  52. // mapURL:"../../data/",
  53. // themeURL:"../../data/theme/",
  54. // themeID: '2001',
  55. // level: 1
  56. // }
  57. let toolbarOptions = {
  58. //控件产生
  59. floorButtonCount: 3,
  60. viewModeControl: true, //是否显示2、3D切换按钮,默认为true
  61. floorModeControl: true, // 是否显示楼层控件,默认为true
  62. needAllLayerBtn: true, //是否显示单多层按钮,默认为true
  63. position: 3, //控件位置。分为左上 1、左下2、右上3、右下4。
  64. offset: { x: 0, y: 166 } //控件位置偏移。{x:10,y:10},基于原始位置的x,y方向的偏移。
  65. };
  66. let zoomOptions = {
  67. position: 3, //分为左上 1、左下2、右上3、右下4。
  68. offset: { x: 0, y: 50 } //控件位置偏移。{x:10,y:10},基于原始位置的x,y方向的偏移。
  69. };
  70. let compassOptions = {
  71. position: 2 //分为左上 1、左下2、右上3、右下4。
  72. };
  73. map.on("loaded", function () {
  74. let toolbar = new fengmap.FMToolbar(toolbarOptions); //楼层控件
  75. let zoomToolbar = new fengmap.FMZoomControl(zoomOptions); //缩放控件
  76. let compass = new fengmap.FMCompass(compassOptions); //指南针控件
  77. toolbar.addTo(map);
  78. zoomToolbar.addTo(map);
  79. compass.addTo(map);
  80. compass.on("click", function () {
  81. map.setRotation({
  82. rotation: 0,
  83. animate: true,
  84. duration: 0.3,
  85. finish: function () {
  86. // console.log("setRotation");
  87. }
  88. });
  89. });
  90. });
  91. }
  92. })
  93. </script>
  94. </html>