首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

基于HTML5 Canvas的CSG构造实体几何书架

本例 Demo 地址: http://hightopo.com/guide/guide/plugin/modeling/examples/example_bookshelf.html 先来看下效果图:...window.addEventListener('resize', function (e) { mainSplit.invalidate(); }, false); 上面代码是一种非常常见的在 HTML...,对两边的书架有缺的再进行补充。...首先我们添加了一个 ht.CSGNode 节点 shelf,作为书架的主节点,其他的节点都是依附于这个节点的,对这个节点设置了位置、大小、名称以及六个面的颜色,然后添加进数据模型 DataModel: ...,我们在书架的上下左右都加上了 ht.CSGNode,最后为了更加具象化,我们还添加了一本书,实现方式也差不多,都非常简单: var book = new ht.Node(); book.setName

1.2K30

基于HT的CSG功能构建HTML5的3D书架

回到我们今天要搞的3D书架例子,我们将基于HT for Web的3D引擎来实现,HT已经内置了CSG功能的模型封装,我们通过构建CSGNode图元对象,该类型图元可对Host吸附的图元进行CSG技术的合集...的三维组件,上部分的Graph3dView组件添加了VisibleFunc的可见过滤器,隐藏了如下部分的Graph3dView中蓝色立方体图元,这些蓝色立方体图元就是CSGNode,其作用就是用来裁剪其吸附的书架...Shelf对象,因此一般在3D编辑器状态下才需要出现,运行时科如上部分Graph3dView组件那样,通过添加可见过滤器将其隐藏,这样就实现了有凹槽可摆放书籍内容的3D书架效果,本例我们作为示例仅放了一本...书架两边分别摆放了两个不同风格的小书台,通过上图我拖拽改变了蓝色CSGNode图元的位置,大家通过两张图的对比能更直观的体会到CSG的操作效果,玻璃门开关以及相册效果都是直接利用HT for Web的3D...以下是该HT for Web的3D例子的所有JavaScript代码供参考:http://v.youku.com/v_show/id_XODU2MTQ4NjI4.html ht.Default.setImage

1.1K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    基于HT的CSG功能构建HTML5的3D书架

    回到我们今天要搞的3D书架例子,我们将基于HT for Web的3D引擎来实现,HT已经内置了CSG功能的模型封装,我们通过构建CSGNode图元对象,该类型图元可对Host吸附的图元进行CSG技术的合集...的三维组件,上部分的Graph3dView组件添加了VisibleFunc的可见过滤器,隐藏了如下部分的Graph3dView中蓝色立方体图元,这些蓝色立方体图元就是CSGNode,其作用就是用来裁剪其吸附的书架...Shelf对象,因此一般在3D编辑器状态下才需要出现,运行时科如上部分Graph3dView组件那样,通过添加可见过滤器将其隐藏,这样就实现了有凹槽可摆放书籍内容的3D书架效果,本例我们作为示例仅放了一本...书架两边分别摆放了两个不同风格的小书台,通过上图我拖拽改变了蓝色CSGNode图元的位置,大家通过两张图的对比能更直观的体会到CSG的操作效果,玻璃门开关以及相册效果都是直接利用HT for Web的3D...以下是该HT for Web的3D例子的所有JavaScript代码供参考:http://v.youku.com/v_show/id_XODU2MTQ4NjI4.html ht.Default.setImage

    1.4K50

    洛谷P2676 超级书架

    题目描述 Farmer John最近为奶牛们的图书馆添置了一个巨大的书架,尽管它是如此的大,但它还是几乎瞬间就被各种各样的书塞满了。现在,只有书架的顶上还留有一点空间。...书架的高度为B,并且保证 1 <= B <= S < 2,000,000,007。 为了够到比最高的那头奶牛还要高的书架顶,奶牛们不得不象演杂技一般,一头站在另一头的背上,叠成一座“奶牛塔”。...为了往书架顶上放东西,所有奶牛的身高和必须不小于书架的高度。显然,塔中的奶牛数目越多,整座塔就越不稳定,于是奶牛们希望在能够到书架顶的前提下,让塔中奶牛的数目尽量少。...输入输出格式 输入格式: 第1行: 2个用空格隔开的整数:N 和 B * 第2..N+1行: 第i+1行是1个整数:H_i 输出格式: 第1行: 输出1个整数,即最少要多少头奶牛叠成塔,才能够到书架顶部...输入输出样例 输入样例#1: 6 40 6 18 11 13 19 11 输出样例#1: 3 说明 输入说明: 一共有6头奶牛,书架的高度为40,奶牛们的身高在6..19之间。

    91560

    填充书架(DP)

    题目 附近的家居城促销,你买回了一直心仪的可调节书架,打算把自己的书都整理到新的书架上。...按顺序 将这些书摆放到总宽度为 shelf_width 的书架上。 先选几本书放在书架上(它们的厚度之和小于等于书架的宽度 shelf_width),然后再建一层书架。...例如,如果这里有 5 本书,那么可能的一种摆放情况是:第一和第二本书放在第一层书架上,第三本书放在第二层书架上,第四和第五本书放在最后一层书架上。...每一层所摆放的书的最大高度就是这一层书架的层高,书架整体的高度为各层高之和。 以这种方式布置书架,返回书架整体可能的最小高度。...第 2 本书不必放在第一层书架上。

    52120

    小说书架内容质量自动化测试

    一.项目背景 小说书架的产品思路是:在手机QQ浏览器这个平台上,给用户提供一个小说书架这样的小说阅读入口。...理想的情况下,我们将小说书架上的书与始发站点的该书做对比,得到的缺章,错章数据是最准确的,但是由于小说书架上的书来源有很多,每个始发站点上内容的抽取方式都不同,因此将小说书架上的书与始发站点的书做对比不是很现实...在这种情况下,我们选择将小说书架上的书与百度小说中的该书进行对比,来考量小说书架错章和缺章的情况。...(2)小说书架自比发现重章 ? 图1.判断重章的逻辑图 从上面的逻辑图中我们可以看出,判断小说书架是否有重章只需要小说书架的目录中的章节标题自比即可,不需要与百度小说的目录进行对比。...余下的区域C代表百度小说中有,但是小说书架中没有的章节,这表明区域C很有可能是小说书架缺少的章节;区域A代表小说书架中有,百度小说中没有的章节,我们判定区域A中可能含有小说书架错误的章节。

    1.3K50

    HTML 入门笔记 - 初识HTML

    DOCTYPE HTML>标题标签... ---- 了解HTML的代码注释 什么是代码注释?代码注释的作用是帮助程序员标注代码的用途,过一段时间后再看你所编写的代码,就能很快想起这段代码的用途。...---- 为你的网页中添加一些空格 在html代码中输入空格、回车都是没有作用的。要想输入空格,必须写入nbsp;。不要忘了那个分号 在html代码中输入空格是不起作用的,如下代码。 ?...语法: html4.01版本 xhtml1.0版本 注意: 标签和标签一样也是一个空标签,所以只有一个开始标签,没有结束标签。...答案是使用HTML表单(form)。表单是可以把浏览者输入的数据传送到服务器端,这样服务器端程序就可以处理表单传过来的数据。

    6.5K51

    HTML入门手记(1)HTML概述HTML基本语法

    HTML概述 学习原因:希望制作一云项目控制工具,HTML用于提供GUI并消除不同客户端差异 学习目标:会使用HTML语言,Jinja模板和Bootstrap框架(不求精通) 教程选择: 目标 教程 HTML...语言 菜鸟HTML教程 JinJa模板 思诚之道Jinja教程 Bootstrap框架 未定 HTML是一种超文本标记语言,由不同的标签构成树形结构。...超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。...您可以使用 HTML 来建立自己的 WEB 站点,HTML 运行在浏览器上,由浏览器来解析。...HTML基本语法 元素与属性 HTML由元素构成,每个元素由元素开始标签,元素内容和元素结束标签构成如b中,为元素开始标签表示一个段落元素开始,b为元素内容,为元素结束标签,

    9.5K41

    html

    tag) HTML 使用标记标签来描述网页 HTML 标记标签通常被称为 HTML 标签 (HTML tag): HTML 标签是由尖括号包围的关键词,比如 HTML 标签通常是成对出现的...,比如 和 标签对中的第一个标签是开始标签,第二个标签是结束标签 开始和结束标签也被称为开放标签和闭合标签 html文档包括html标签和纯文本,html文档也被称为网页。...Web浏览器的作用是读取HTML文档,并以网页的形式显示出来。 常用的html标签 一个html文档大概会包括以下内容,复杂网页一般会包括更多不同的标签以及对标签进行属性的调整来得到更加丰富的页面。...html属性 HTML标签可以拥有属性。 属性提供了有关HTML元素的更多的信息。 属性总是以名称/值对的形式出现,比如:name=“value”。 属性总是在HTML元素的开始标签中规定。...可以理解为HTML 元素指的是从开始标签到结束标签的所有代码。大多数HTML元素可以嵌套(可以包含其他HTML元素)。HTML文档由嵌套的HTML元素构成。

    1.9K10
    领券