bill
/
cad_house


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
							<!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/jquery-2.1.1.min.js"></script>
<script>
  //解析查询字符串
  function getQueryStringArgs() {
    //取得查询字符串，并去掉开头'?'
    var qs = location.search.length ? location.search.substring(1) : '';
    //保存数据的对象
    var args = {},
      //以分割符'&'分割字符串，并以数组形式返回
      items = qs.length ? qs.split('&') : [],
      item = null,
      name = null,
      value = null,
      i = 0,
      len = items.length;
    //逐个将每一项添加到args对象中
    for (; i < len; i++) {
      item = items[i].split('=');
      //解码操作，因为查询字符串经过编码的
      name = decodeURIComponent(item[0]);
      value = decodeURIComponent(item[1]);
      value = item[1];
      if (name.length) {
        args[name] = value;
      }
    }
    return args;
  }

  function main() {
    let args = getQueryStringArgs()

    $.ajax({
      url: 'https://4dkk.4dage.com/data/data' + args.m + '/floor.json?m=36',
      method: 'GET',
      success(data) {
        let $layer = document.querySelector('#cad')
        let cad = structureCAD({
          data:
          {
            block: [],
            column: [],
            door: [],
            hole: [],
            segment: [],
            "vertex-xy": [],
            "vertex-z": []
          }, layer: $layer
        });

        cad.showLabel();
        cad.showDire();
        cad.loadData(JSON.parse(data));

        [].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))
            })

        })
      }
    })
  }

  main()
</script>