几何绘制
<h1>几何绘制</h1>
<h2>概述</h2>
<p><code>BCore.Extension.Draw</code> 类库提供了一组用于绘制几何图形的功能，包括点、线和面。用户可以通过这些功能在三维视图中添加自定义的几何对象并进行交互。</p>
<h2>类及其说明</h2>
<ul>
<li><strong>BCore.Extension.Draw.PointGeometry</strong>: 点的几何图形</li>
<li><strong>BCore.Extension.Draw.LineGeometry</strong>: 线的几何图形</li>
<li><strong>BCore.Extension.Draw.FaceGeometry</strong>: 面的几何图形</li>
<li><strong>BCore.Extension.Draw.GeometryManagerConfig</strong>: 几何管理器的配置</li>
<li><strong>BCore.Extension.Draw.GeometryManager</strong>: 几何绘制管理器</li>
</ul>
<h3>1. 点几何 - PointGeometry</h3>
<p><strong>构造</strong>:</p>
<pre><code class="language-javascript">new BCore.Extension.Draw.PointGeometry()</code></pre>
<p><strong>可选参数</strong>:</p>
<pre><code class="language-javascript">{
position: { x: 0, y: 0, z: 0 },
color: &quot;#ffffff&quot;,
size: 15,
depthTest: false,
sizeAttenuation: false,
transparent: true,
opacity: 1.0,
}</code></pre>
<p>> 注意: <code>transparent</code> 和 <code>depthTest</code> 不能同时设置为 false。</p>
<p><strong>示例</strong>:</p>
<pre><code class="language-javascript">let mDrawGeometryConfig = new BCore.Extension.Draw.GeometryManagerConfig(mViewer3D);
let mDrawGeometryManager = new BCore.Extension.Draw.GeometryManager(mDrawGeometryConfig);
let pointGeometry = new BCore.Extension.Draw.PointGeometry();
pointGeometry.mOptions.color = &quot;#fff333&quot;;
mDrawGeometryManager.addGeometry(&#039;point&#039;, pointGeometry);</code></pre>
<h3>2. 线几何 - LineGeometry</h3>
<p><strong>构造</strong>: </p>
<pre><code class="language-javascript">new BCore.Extension.Draw.LineGeometry()</code></pre>
<p><strong>可选参数</strong>:</p>
<pre><code class="language-javascript">{
position: [], // [{x,y,z},{x,y,z}]
color: &quot;#FFFFFF&quot;,
width: 2,
lineType: &#039;default&#039;,
depthTest: false,
depthWrite: true,
dashed: false,
dashScale: 1.5,
gapSize: 1,
dashSize: 6,
}</code></pre>
<p><strong>示例</strong>:</p>
<pre><code class="language-javascript">let mDrawGeometryConfig = new BCore.Extension.Draw.GeometryManagerConfig(mViewer3D);
let mDrawGeometryManager = new BCore.Extension.Draw.GeometryManager(mDrawGeometryConfig);
let lineGeometry = new BCore.Extension.Draw.LineGeometry();
lineGeometry.mOptions.color = &#039;#ff0000&#039;;
lineGeometry.mOptions.position = [{ x: 0, y: 0, z: 0 }, { x: 100, y: 0, z: 0 }, { x: 100, y: 30, z: 0 }];
mDrawGeometryManager.addGeometry(&#039;line&#039;, lineGeometry);</code></pre>
<h3>3. 面几何 - FaceGeometry</h3>
<p><strong>构造</strong>:</p>
<pre><code class="language-javascript">new BCore.Extension.Draw.FaceGeometry()</code></pre>
<p><strong>可选参数</strong>:</p>
<pre><code class="language-javascript">{
positions: [],
color: &quot;#fff333&quot;,
depthTest: false,
transparent: true,
opacity: 0.5,
side: THREE.DoubleSide,
}</code></pre>
<p>> 注意: <code>transparent</code> 和 <code>depthTest</code> 不能同时设置为 false。</p>
<p><strong>示例</strong>:</p>
<pre><code class="language-javascript">let mDrawGeometryConfig = new BCore.Extension.Draw.GeometryManagerConfig(mViewer3D);
let mDrawGeometryManager = new BCore.Extension.Draw.GeometryManager(mDrawGeometryConfig);
let faceGeometry = new BCore.Extension.Draw.FaceGeometry();
faceGeometry.mOptions.color = &#039;#ff0000&#039;;
faceGeometry.mOptions.positions = [{ x: 0, y: 0, z: 0 }, { x: 100, y: 0, z: 0 }, { x: 100, y: 30, z: 0 }];
mDrawGeometryManager.addGeometry(&#039;face&#039;, faceGeometry);</code></pre>
<h3>4.几何管理器配置 - GeometryManagerConfig</h3>
<p><strong>构造</strong>:</p>
<pre><code class="language-javascript">new BCore.Extension.Draw.GeometryManagerConfig(Viewer3D)</code></pre>
<p><strong>参数</strong>:</p>
<ul>
<li><code>viewer3D</code>: 三维模型视图对象</li>
</ul>
<h3>5.几何绘制管理器 - GeometryManager</h3>
<p><strong>构造</strong>: </p>
<pre><code class="language-javascript">new BCore.Extension.Draw.GeometryManager(config)</code></pre>
<p><strong>参数</strong>:</p>
<ul>
<li><code>config</code>: 管理工具的配置参数</li>
</ul>
<h3>方法</h3>
<ul>
<li><strong>addGeometry(name, geometry)</strong>: 添加自绘几何图形。</li>
<li><strong>deleteGeometry(name)</strong>: 删除自绘几何图形。</li>
<li><strong>deleteAllGeometry()</strong>: 删除所有自绘几何图形。</li>
<li><strong>onClick(callback: Function)</strong>: 添加几何图形单击事件。</li>
<li><strong>onDbClick(callback: Function)</strong>: 添加几何图形双击事件。</li>
<li><strong>onBoxSelect(callback: Function)</strong>: 添加几何图形框选事件。</li>
<li><strong>setCustomColorByNames(color: string, names: string[])</strong>: 设置自定义颜色。</li>
<li><strong>getCustomColorByName(name: string)</strong>: 获取自定义颜色。</li>
<li><strong>clearCustomColorByNames(names: string[])</strong>: 清除自定义颜色。</li>
<li><strong>clearAllCustomColor()</strong>: 清所有自定义颜色。</li>
<li><strong>setCustomOpacityByNames(opacity: number, names: string[])</strong>: 设置自定义透明度。</li>
<li><strong>getCustomOpacityByName(name: string)</strong>: 获取自定义透明度。</li>
<li><strong>clearCustomOpacityByNames(names: string[])</strong>: 清除自定义透明度。</li>
<li><strong>clearAllCustomOpacity()</strong>: 清除所有自定义透明度。</li>
<li><strong>setDepthTestByNames(depthTest: boolean, names: string[])</strong>: 设置深度测试。</li>
<li><strong>getDepthTestByName(name: string)</strong>: 获取深度测试状态。</li>
</ul>
<h3>示例代码片段</h3>
<p>以下示例演示了如何使用这些方法：</p>
<pre><code class="language-javascript">let mDrawGeometryConfig = new BCore.Extension.Draw.GeometryManagerConfig(mViewer3D);
let mDrawGeometryManager = new BCore.Extension.Draw.GeometryManagerDrawGeometryConfig);
// 添加点
let pointGeometry = new BCore.Extension.Draw.PointGeometry();
pointGeometry.mOptions.color = &quot;#fff333&quot;;
mDrawGeometryManager.addGeometry(&#039;point&#039;, pointGeometry);
// 注册点击事件
mDrawGeometryManager.onClick(() =&gt; { console.log(&#039;Point Clicked!&#039;); });
// 更新颜色
mDrawGeometryManager.setCustomColorByNames(&#039;blue&#039;, [&#039;point&#039;]);</code></pre>
<hr />