JavaScript实现封闭区域布尔运算的示例代码


Posted in Javascript onJune 25, 2018

这篇文章主要介绍多段线实现布尔运算的方法

先上代码

function getOperatedCurves(sourceCurs: Curve[], targetCus: Curve[])
  {
    let source: Polyline | Circle = (sourceCurs[0] instanceof Circle) ? sourceCurs[0] as Circle : new Polyline().Combine(sourceCurs)[0];
    let target: Polyline | Circle = (targetCus[0] instanceof Circle) ? targetCus[0] as Circle : new Polyline().Combine(targetCus)[0];
    try
    {
      if (!source.IsClose || !target.IsClose) throw new Error("不是封闭曲线");
    }
    catch (err)
    {
      console.log(err);
    }

    let interPts = source.IntersectWith(target, IntersectOption.OnBothOperands);
    let sourceContainerTarget = isTargetCurInSourceCur(source, target);
    let targetContainerSource = isTargetCurInSourceCur(target, source);

    let isContainer = sourceContainerTarget || targetContainerSource;
    let intersectionList: Curve[] = []; //交集
    let unionList: Curve[] = []; //并集
    let subList: Curve[] = []; //补集

    /*
    *两封闭区域有交点并且不是包含关系,则通过交点把区域分割
    */
    if (interPts.length && !isContainer)
    {
      let pars1 = interPts.map(p => source.GetParamAtPoint(p)).sort((a, b) => a - b);
      let pars2 = interPts.map(p => target.GetParamAtPoint(p)).sort((a, b) => a - b);

      let cus1: Array<Polyline | Arc> = source.GetSplitCurves(pars1);

      cus1.forEach(pl =>
      {
        if (isTargetCurInSourceCur(target, pl))
        {
          intersectionList.push(pl);
        }
        else
        {
          subList.push(pl);
          unionList.push(pl);
        }
      })

      let cus2: Array<Polyline | Arc> = target.GetSplitCurves(pars2);
      cus2.forEach(pl =>
      {
        if (isTargetCurInSourceCur(source, pl))
        {
          intersectionList.push(pl);
          subList.push(pl);
        }
        else
        {
          unionList.push(pl);
        }
      })

    }
    else
    {
      if (isContainer)
      {
        if (sourceContainerTarget)
        {
          intersectionList.push(target);
          subList.push(source, target);
          unionList.push(source);
        }
        else
        {
          unionList.push(target);
          intersectionList.push(source);
        }
      }
      else
      {
        unionList.push(source, target)
        subList.push(source);
      }

    }
    return {
      intersectionList, unionList, subList
    }
  }

由于一些曲线类实现方法不一,这里主要说一些实现布尔运算的思路

  1. 判断2封闭曲线是否是被包含的关系
  2. 获取2封闭曲线的所有交点,这里交点可能是圆和线,线和线,圆和圆的,求交点的方法网上应该很多,以后有时间也会写写用JavaScript实现方式
  3. 根据所有的交点把2封闭曲线分割为多个部分
  4. 对分割后的线段进行整理,其中相交部分是曲线在对方曲线内部的部分,合并是互不在对方曲线内部的部分,相减类似不想说了,具体看代码,如果是被包含状态则更加就简单了

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javaScript复制功能调用实现方案
Dec 13 Javascript
js jquery获取随机生成id的服务器控件的三种方法
Jul 11 Javascript
javascript强制点击广告的方法
Feb 06 Javascript
jQuery插件EasyUI实现Layout框架页面中弹出窗体到最顶层效果(穿越iframe)
Aug 05 Javascript
AngularJS入门教程引导程序
Aug 18 Javascript
Javascript中关于Array.filter()的妙用详解
Dec 04 Javascript
require.js与bootstrap结合实现简单的页面登录和页面跳转功能
May 12 Javascript
Javascript ES6中对象类型Sets的介绍与使用详解
Jul 17 Javascript
详解webpack-dev-server使用方法
Sep 14 Javascript
JavaScript从原型到原型链深入理解
Jun 03 Javascript
详解JavaScript 异步编程
Jul 13 Javascript
vue 使用 v-model 双向绑定父子组件的值遇见的问题及解决方案
Mar 01 Vue.js
详解React之父子组件传递和其它一些要点
Jun 25 #Javascript
Vue EventBus自定义组件事件传递
Jun 25 #Javascript
一个Vue页面的内存泄露分析详解
Jun 25 #Javascript
Vue.js项目中管理每个页面的头部标签的两种方法
Jun 25 #Javascript
angularjs结合html5实现拖拽功能
Jun 25 #Javascript
vue中vee validate表单校验的几种基本使用
Jun 25 #Javascript
超出JavaScript安全整数限制的数字计算BigInt详解
Jun 24 #Javascript
You might like
浅析PHP substr,mb_substr以及mb_strcut的区别和用法
2013/06/21 PHP
PHP利用func_get_args和func_num_args函数实现函数重载实例
2014/11/12 PHP
学习php设计模式 php实现桥梁模式(bridge)
2015/12/07 PHP
ThinkPHP框架实现的MySQL数据库备份功能示例
2018/05/24 PHP
JavaScript使用prototype定义对象类型(转)[
2006/12/22 Javascript
asp.net HttpHandler实现图片防盗链
2009/11/09 Javascript
jquery提升性能最佳实践小结
2010/12/06 Javascript
Google Map V3 绑定气泡窗口(infowindow)Dom事件实现代码
2013/04/26 Javascript
js的参数有长度限制吗?发现不能超过2083个字符
2014/04/20 Javascript
自己封装的javascript事件队列函数版
2014/06/12 Javascript
jQuery实现按键盘方向键翻页特效
2015/03/18 Javascript
JavaScript移除数组内重复元素的方法
2015/03/18 Javascript
TypeScript 中接口详解
2015/06/19 Javascript
JS实现的表格行上下移动操作示例
2016/08/03 Javascript
简单实现bootstrap选项卡效果
2017/02/08 Javascript
Web技术实现移动监测的介绍
2017/09/18 Javascript
js实现左右两侧浮动广告
2018/07/09 Javascript
原生js实现日期选择插件
2020/05/21 Javascript
[00:48]食人魔魔法师至宝“金鹏之幸”全新模型和自定义特效展示
2019/12/19 DOTA
import的本质解析
2017/10/30 Python
PyQt5每天必学之QSplitter实现窗口分隔
2018/04/19 Python
PyQt5实现从主窗口打开子窗口的方法
2019/06/19 Python
Python 静态方法和类方法实例分析
2019/11/21 Python
python GUI库图形界面开发之PyQt5窗口控件QWidget详细使用方法
2020/02/26 Python
基于CSS3实现的几个小loading效果
2018/09/27 HTML / CSS
HTML5自定义data-* data(obj)属性和jquery的data()方法的使用
2012/12/13 HTML / CSS
自我鉴定范文300字
2013/10/01 职场文书
会计专业应届生求职信
2013/11/24 职场文书
我的理想演讲稿
2014/04/30 职场文书
班子群众路线教育实践个人对照检查材料思想汇报
2014/09/30 职场文书
2014房屋登记授权委托书
2014/10/13 职场文书
2014年学习委员工作总结
2014/11/14 职场文书
优秀党员申报材料
2014/12/18 职场文书
跑出一片天观后感
2015/06/08 职场文书
新党员入党决心书
2015/09/22 职场文书
领导干部学习十八届五中全会精神心得体会
2016/01/05 职场文书