快速开发HTML5WebGL3D斜坡拖拽生成模型里面的曲面如何确定？我们知道空间中的一个面可以由一个点和一条法线组成。这个Demo的左边是面板。将对象从面板拖到右侧的3D场景中。当然，我拖动鼠标的位置就是放置物体的点，但是这次我们的重点是如何将模型放置在斜坡上。效果图代码生成createscenedm=newht.DataModel();//数据模型(http://hightopo.com/guide/guide/core/datamodel/ht-datamodel-guide.html)g3d=newht.graph3d.Graph3dView(dm);//3D场景组件(http://hightopo.com/guide/guide/core/3d/ht-3d-guide.html)palette=newht.widget.Palette();//panel组件(http://hightopo.com/guide/guide/plugin/palette/ht-palette-guide.html)splitView=newht.widget.SplitView(palette,g3d,'h',0.2);//拆分组件，第三个参数为split方式，h为左右，v为上下；第四个参数为拆分比例，大于1的值为绝对宽度，小于1为拆分比例splitView.addToDOM();//拆分组件添加到body中。这些组件的定义可以在相应的链接中查看。至于将拆分组件添加到body中的addToDOM函数，有必要说明一下（我每次都提到，这个真的很重要！）。HT组件一般嵌入在BorderPane、SplitView、TabView等容器中，而最外层的HT组件需要用户手动将getView()返回的底层div元素添加到页面的DOM元素中。这里需要注意的是，当父容器的尺寸变化时，如果父容器是BorderPane、SplitView等HT预定义的容器组件，HT容器会自动递归调用子组件的invalidate函数通知更新.但是如果父容器是原生的html元素，HT组件无法知道它需要更新，所以最外层的HT组件一般需要监听window的窗口大小变化事件，调用最外层组件的invalidate函数更新。为了方便加载最外层组件填满窗口，HT的所有组件都有addToDOM函数，实现逻辑如下，其中iv是invalidate的简写：addToDOM=function(){varself=this,view=self.getView(),//获取组件底层divstyle=view.style;document.body.appendChild(view);//将组件底层div添加到body中style.left='0';//ht默认所有组件的位置都设置为absolute绝对定位style.right='0';style.top='0';style.bottom='0';window.addEventListener('resize',function(){self.iv();},false);//窗口大小改变事件，调用刷新函数}大家可能注意到了，我在场景中添加的坡度其实是一个HT。这种感觉会更强烈。下面是这个节点的定义：node=newht.Node();node.s3(1000,1,1000);//设置节点的大小node.r3(0,0,Math.PI/4);//设置节点的旋转角度是学过的，跟下面我们要设置的拖拽位置有关系node.s('3d.movable',false);//设置node在3d上是不可移动的，因为这个node只是一个引用，建议是不允许移动dm.add(node);//将node添加到datacontainer的左边内容，构建Palette和GraphView。它由ht.DataModel驱动并使用ht.Group显示组。HT。节点显示按钮元素。我将加载Palette面板中图元的函数封装为initPalette，其定义如下：','温度','室内','监控','其他'];varnameArr=['展览设施','展柜相关','桌椅收纳','温控','室内','视频监控','其他'];//arrNode中的index对应的是nameArr中的一个for(vari=0;i
