一个轻量级的3D CSS 库

JavaScript 3D library

该项目的目的是为了打造轻量级的、实用简单的3D CSS库。

Usage使用方法

下载 minified库文件 和 css文件,并将其包含于你的HTML中,就如此简单。

<script src="js/voxelcss.js"></script><link rel=‘stylesheet‘ href="css/voxel.css"></link>

下面这段代码既是对其应用:

<script>

    var scene, world, editor;

    init();

    function init() {    scene = new voxelcss.Scene();    scene.rotate(-Math.PI / 8, Math.PI / 4, 0);    scene.attach(document.body);

    var lightSource = new voxelcss.LightSource(300, 300, 300, 750, 0.3, 1);    scene.addLightSource(lightSource);

    world = new voxelcss.World(scene);    editor = new voxelcss.Editor(world);    editor.enableAutoSave();

    editor.load();    if(world.getVoxels().length === 0)      editor.add(new voxelcss.Voxel(0, 0, 0, 100, {        mesh: voxelcss.Meshes.grass      }));    }

</script>
时间: 2024-10-20 17:10:28

一个轻量级的3D CSS 库的相关文章

打造属于自己的Altium Designer 3D封装库,不需要懂专门的三维设计软件

看到Andy_2020发的帖子“Altium Designer专题”之后,对Altium Designer的3D功能很感兴趣,着手自己做一个AD的3D封装库.刚开始按照Andy介绍的方法,学了两天Solidworks,画了个PQ3230变压器.晒晒我画的变压器,大神勿喷 不过后来发现有更快捷的方法——直接在网上找器件3D模型,不用自己慢慢画,最主要是这种方法不需要会用Pro/E.solidworks等三维设计软件. 进入正题,我是用的是Altium Designer Winter 09,下面开始

Zepto是一个轻量级的针对现代高级浏览器的JavaScript库

参考文献:http://www.html-5.cn/Manual/Zepto/ Source code on Github Zepto是一个轻量级的针对现代高级浏览器的JavaScript库

IOTutility 一个轻量级的 IOT 基础操作库

目录 IOTutility 一个轻量级的 IOT 基础操作库 1. 为什么要写一个 IOT 编程库? 2. IOTutility 具有什么功能? 3. IOTutility 有什么特点 IOTutility 实现了哪些功能 MQTT protocol implement MQTT 实现 1. 创建一个 MQTT_Session 2. 连接到服务器 3. 订阅感兴趣的主题 4. 可以通过 Publish 接口直接上传消息给服务器 如何使用 1. 下载代码 2. 编译代码库 3. 编译示例程序并执行

[开源] gnet: 一个轻量级且高性能的 Golang 网络库

Github 主页 https://github.com/panjf2000/gnet 欢迎大家围观~~,目前还在持续更新,感兴趣的话可以 star 一下暗中观察哦. 简介 gnet 是一个基于 Event-Loop 事件驱动的高性能和轻量级网络库.这个库直接使用 epoll 和 kqueue 系统调用而非标准 Golang 网络包:net 来构建网络应用,它的工作原理类似于两个开源的网络库:libuv 和 libevent. 这个项目存在的价值是提供一个在网络包处理方面能和 Redis.Hap

2016年 CSS 库、框架和工具新生榜 TOP 50

看看 CSS 在过去几年的巨大变化和快速发展,你就不会对它今年的开源工具大产量感到惊讶了.这些 CSS 库.框架和工具的建立不仅给我们提供了学习的视角,更给我们的工作与生活带来了便利. 本文精选了 50 款 2016 年发布的 CSS 库.框架和工具供大家享用,希望它们对您有所帮助. 分类快速预览:CSS 库,CSS Spinners,CSS 图像特效,CSS 实用程序,设计指南工具,响应式邮件与通讯列表框架,Flexbox 布局工具和框架,CSS 布局框架和 material design 框

DirectUI 2D/3D 界面库集合 分析之总结

DirectUI优点在于能够非常方便的构建高效,绚丽的,非常易于扩展的界面.作者是Bjarke Viksoe, 他的这个界面程序思想和代码都很优秀,他的代码主要表述了他的思想,尽管bug比較多,可是很合适学习. DirctUI在不断的完好,有各种各样的3d界面库出来来了,可是,是它在我懵懂时给了我编程的思想,让我踏上了编程之路,以下,我把我搜集的界面库以及重构的界面库都贴出来,大家技术交流交流. 当中下载包中有: Duilib 开发文档.帮助文档以及分析说明文档 diablo_trunk(UI)

作为一个前端工程师,CSS是最基本的入门课,你都能做出来吗?

CSS在很多程序员看来那只不过是雕虫小技, 实际上CSS3发展到今天已经强大到超乎你的想象, 当然对于低端浏览器使用者来说,还是以前那样——囧 有时候搞CSS开发确实需要很多想象力,下面一组纯CSS3特效足以描述这一点 以下内容转载自[http://design.yesky.com/show/466/11497966_3.shtml] 设计欣赏:纯CSS3「绘制」的图形图标 IE 标志 作者: Andreas Jacob 在 Firefox 3.6+ 以及Safari 5 上显示最佳.使用了圆角

Web 开发中 20 个很有用的 CSS 库

转自:http://www.oschina.net/translate/css-libraries-for-developers 在过去的几年中,CSS已经成为一大部分开发者和设计者的最爱,因为它提供了一系列功能和特性.每个月都有无数个围绕CSS的工具被开发者发布以简化WEB开发.像CSS 库,框架,应用这样的工具能够为开发者做很多事,而且可以使开发者创造出创新立异的WEB应用. 在这篇文件章中我们找到了一系列对开发者有用的CSS库,它们能帮助开发者在一定的期限内取得有创造性和创新性的成果.我们

网页3D效果库Three.js初窥

网页3D效果库Three.js初窥 背景 一直想研究下web页面的3D效果,最后选择了一个比较的成熟的框架Three.js下手 ThreeJs官网 ThreeJs-github; 接下来我会陆续翻译 Three.js官网的文档,部分文字和代码为我个人添加. 第一部分:three.js介绍 创建场景 这部分的目标是为Three.js做一个简单的介绍,我们会以创建一个场景,一个旋转的立方里开始,文章的结尾会有一个可运行的完整示例为你解惑. 开始之前 在你使用Three.js之前,你需要在你的电脑上建