chenzhiguang
/
cd_mingrenguan


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
							<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" href="/static/style/public.css">
  <title>4DCAD</title>
</head>
<body>
  <div class="body">
    <div id="cad"></div>
    <div class="content">
      <ul>
        <li>
          <div class="itemTitle">
            <span>增添细节</span>
          </div>
          <ul class="chose" id="architecture">
            <li attr-type="door">
              <div><i class="iconfont icon_door"></i></div><span>门</span>
            </li>
            <li attr-type="casement">
              <div><i class="iconfont icon_window"></i></div><span>窗户</span>
            </li>
            <li attr-type="column">
              <div><i class="iconfont icon_column"></i></div><span>柱子</span>
            </li>
            <li attr-type="point">
              <div><i class="iconfont icon_point"></i></div><span>点</span>
            </li>
            <li attr-type="slideDoor">
              <div><i class="iconfont icon_point"></i></div><span>移门</span>
            </li>
            <li attr-type="tagging">
              <div><i class="iconfont icon_point"></i></div><span>标注</span>
            </li>
            <li attr-type="groundCase">
              <div><i class="iconfont icon_point"></i></div><span>落地窗</span>
            </li>
            <li attr-type="bayCase">
              <div><i class="iconfont icon_point"></i></div><span>飘窗</span>
            </li>
            <li attr-type="furnColumn">
              <div><i class="iconfont icon_column"></i></div><span>独立柱</span>
            </li>
            <li attr-type="furnFlue">
              <div><i class="iconfont icon_column"></i></div><span>独立柱</span>
            </li>
            <li attr-type="line">
              <div><i class="iconfont icon_column"></i></div><span>墙</span>
            </li>
          </ul>

          <a id="aaa">导出</a>
          <a id="bbb">测试</a>
        </li>
      </ul>

      <a class="btn" id="resove">&lt;</a>
      <a class="btn" id="back">&gt;</a>
    </div>
  </div>

</body>
</html>
<script src="/static/three95.min.js"></script>
<script src="/static/data.js"></script>
<script>
  let $layer = document.querySelector('#cad')
  let cad = structureCAD({
    data: 
    {
        block:[],
        column: [],
        door:[],
        hole:[],
        segment:[],
        "vertex-xy":[],
        "vertex-z":[]
    }, layer: $layer, edit: false});

    
    // cad.loadData(joinData(data, data2, 0, 11).data)
    // cad.loadData(joinData(data2, data, 11, 0).data)
    cad.loadData(data)
    // cad.loadData(data2)
    cad.showLabel();
    cad.showDire();

  [].forEach.call(document.querySelectorAll('#architecture  li'), function($item) {
    $item.addEventListener('click', function(ev) {
      $layer.addEventListener('click', function handle(ev) {
        let ret = cad.increase($item.getAttribute('attr-type'), {x: ev.offsetX, y: ev.offsetY}, null, null, true)

        if (ret.error) {
          alert(ret.msg)
        }
        this.removeEventListener('click', handle)
      })
    })
  })

  document.querySelector('#resove').addEventListener('click', function(ev) {
    cad.previous()
  })
  document.querySelector('#back').addEventListener('click', function(ev) {
    cad.next()
  })
  document.querySelector('#aaa').addEventListener('click', function(ev) {
    cad.screenshot()
      .then(function(data) {
        console.log(data)
        window.open(window.URL.createObjectURL(data.file))
      })
    
  })


</script>