drawingBim.html 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8"/>
  5. <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
  6. <title>二三维联动</title>
  7. <link rel="stylesheet" href="//static.bimface.com/attach/9aa6ee08a53d42639c6d867a81a05bed_common.css"/>
  8. <link rel="stylesheet" href="//static.bimface.com/attach/c1791a1d6c914fedb88d3a04450e2053_2D3D.css"/>
  9. <script src="//static.bimface.com/attach/257ed7db869147478d775d71ca0ed2fc_jquery-3.3.1.min.js"></script>
  10. <script src="//static.bimface.com/api/BimfaceSDKLoader/BimfaceSDKLoader@latest-release.js" ></script>
  11. </head>
  12. <body>
  13. <section class="wrap">
  14. <section class="viewer-box">
  15. <div class="viewer-2d" id="viewer2d"></div>
  16. <div class="viewer-3d" id="viewer3d"></div>
  17. </section>
  18. </section>
  19. <script type="text/javascript" >
  20. var viewToken = '476d1c82e9e8447aa9ab9c9a16ac0a1d';
  21. var viewerDrawing;
  22. // 初始化显示组件
  23. var options = new BimfaceSDKLoaderConfig();
  24. options.viewToken = viewToken;
  25. BimfaceSDKLoader.load(options, successCallback, failureCallback);
  26. function successCallback(viewMetaData) {
  27. // 获取DOM元素
  28. var dom3d = document.getElementById('viewer3d');
  29. // 配置参数
  30. var config = new Glodon.Bimface.Application.WebApplication3DConfig();
  31. config.domElement = dom3d;
  32. config.enableViewhouse = false;
  33. //取消工具条
  34. // config.Toolbars = [];
  35. // 创建viewer3D对象
  36. var app = new Glodon.Bimface.Application.WebApplication3D(config);
  37. // 添加模型
  38. app.addView(viewToken);
  39. //模型点击监听事件
  40. app.addEventListener(Glodon.Bimface.Viewer.Viewer3DEvent.MouseClicked,function(el){
  41. //根据模型构件ID获取对应图纸的构件ID
  42. var did = viewerDrawing.toDrawingId(el.objectId);
  43. if(did){
  44. //如果有对应的模型构件ID,就缩放到对应位置
  45. viewerDrawing._drawingViewer.zoomToObject(did);
  46. viewerDrawing._drawingViewer.update();
  47. }
  48. })
  49. // 监听添加view完成的事件
  50. app.addEventListener(Glodon.Bimface.Viewer.Viewer3DEvent.ViewAdded, function() {
  51. // 渲染3D模型
  52. app.render();
  53. var viewer3D = app.getViewer();
  54. //自适应屏幕大小
  55. window.onresize=function(){
  56. viewer3D.resize(document.documentElement.clientWidth,document.documentElement.clientHeight-40)
  57. }
  58. //隐藏右上角viewhouse
  59. //viewer3D.hideViewHouse();
  60. var options2d = new BimfaceSDKLoaderConfig();
  61. options2d.viewToken = viewToken;
  62. options2d.viewType = BimfaceViewTypeOption.DrawingView;
  63. BimfaceSDKLoader.load(options2d, successCallback2d, failureCallback2d);
  64. function successCallback2d(viewMetaData) {
  65. var dom2d = document.getElementById('viewer2d');
  66. var config2d = new Glodon.Bimface.Viewer.ViewerDrawingConfig();
  67. config2d.domElement = dom2d;
  68. //添加图纸
  69. viewerDrawing = new Glodon.Bimface.Viewer.ViewerDrawing(config2d);
  70. var drawingUrl = viewMetaData.drawingUrl;
  71. //如果是单模型的话,只需要传图纸id
  72. var _id =582803;
  73. viewerDrawing.load(viewToken,_id);
  74. //如果是集成模型的话,需要传图纸id和单模型的fileid
  75. // var _id =1287057;
  76. // var _fileid =1628186476905664;
  77. // viewerDrawing.load(viewToken,_id,_fileid);
  78. viewerDrawing.addEventListener(Glodon.Bimface.Viewer.ViewerDrawingEvent.ComponentsSelectionChanged,function(el){
  79. if(el.length > 0){
  80. // var drawid=_fileid+'.'+el[0]
  81. // console.log(drawid);
  82. //根据图纸点击的构件ID获取对应的模型构件ID
  83. var rid = viewerDrawing.toModelId(el[0]);
  84. viewer3D.clearIsolation();
  85. //定位到该构件
  86. viewer3D.setSelectedComponentsById([rid]);
  87. //是否存在构件
  88. var isExist = viewer3D.getViewer().getComponentInfoByUserId(rid);
  89. if (isExist) {
  90. //隔离构件,其他半透明
  91. viewer3D.isolateComponentsById([rid], Glodon.Bimface.Viewer.IsolateOption.MakeOthersTranslucent);
  92. //集成模型需要把fileid加进去
  93. //viewer3D.isolateComponentsById([_fileid+'.'+rid], Glodon.Bimface.Viewer.IsolateOption.MakeOthersTranslucent);
  94. //定位到该构件
  95. //viewer3D.setSelectedComponentsById([_fileid+'.'+rid]);
  96. viewer3D.zoomToSelectedComponents();
  97. } else {
  98. viewer3D.clearIsolation();
  99. viewer3D.render();
  100. }
  101. }
  102. })
  103. }
  104. function failureCallback2d(error){
  105. console.log(error);
  106. }
  107. })
  108. }
  109. function failureCallback(error) {
  110. console.log(error);
  111. };
  112. </script>
  113. </body>
  114. </html>