xujunjie
/
BigScreen


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
							<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>React 大数据可视化</title>
  <link rel="stylesheet" href="index.css" />
  <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
  <link href="//mapopen.bj.bcebos.com/github/BMapGLLib/DrawingManager/src/DrawingManager.min.css" rel="stylesheet">
  <script type="text/javascript"
    src="//api.map.baidu.com/api?type=webgl&v=4.0&ak=ILQH1WYMHbSlqFNViqca6j62Ga7bSOzW"></script>
  <script type="text/javascript" src="//api.map.baidu.com/library/LuShu/gl/src/LuShu_min.js"></script>
  <script src="//mapopen.bj.bcebos.com/github/BMapGLLib/DrawingManager/src/DrawingManager.min.js"></script>
</head>

<body>
  <ul class="drawing-panel">

    <div id="root"></div>
    <script src="index.js"></script>
</body>

<style>
  .drawing-panel {
    z-index: 999;
    position: absolute;
    top: 0.5rem;
    margin-left: 0.5rem;
    padding-left: 0;
    border-radius: .25rem;
    height: 47px;
    box-shadow: 0 2px 6px 0 rgba(27, 142, 236, 0.5);
  }

  .bmap-btn {
    border-right: 1px solid #d2d2d2;
    float: left;
    width: 64px;
    height: 100%;
    background-image: url(//api.map.baidu.com/library/DrawingManager/1.4/src/bg_drawing_tool.png);
    cursor: pointer;
  }

  .drawing-panel .bmap-marker {
    background-position: -65px 0;
  }

  .drawing-panel .bmap-polyline {
    background-position: -195px 0;
  }

  .drawing-panel .bmap-rectangle {
    background-position: -325px 0;
  }

  .drawing-panel .bmap-polygon {
    background-position: -260px 0;
  }

  .drawing-panel .bmap-circle {
    background-position: -130px 0;
  }
</style>

</html>