整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
辑：David
在工业实践中，零件和电子设备的装配，是复杂机械设备正常运转的关键环节。过去，这些部件装配的基板以平面为主，少数曲面装配的零件，也多半仅限于简单结构，而且不好改装。
对于复杂的三维结构零件，能不能在曲面基板上安装，同时实现安装方便，改装也方便呢？
最近，清华大学张一慧教授团队提出一种新的组装策略，解决了这个问题，并将成果发表在最近一期的Science Advance上 。
论文链接：https://www.science.org/doi/10.1126/sciadv.abm6922
论文提到，具有工程化三维结构的电子设备，对于摩擦力传感、宽视场光学成像和流速测量是必不可少的。
最近在机械引导装配方面的进展，通过控制滚动/折叠/弯曲变形，在高性能材料中建立了确定的三维结构路线。然而，所产生的三维结构大多是在平面基底上形成的，不能直接转移到另一个弯曲的基底上。
本研究介绍了一种有序的组装策略，可以在不同的弯曲表面上将二维薄膜转化为复杂的三维结构。该策略利用预定机械负载，使弯曲的弹性体基底变形为平面/圆柱形结构，然后通过额外的单轴/双轴预拉伸来驱动扣弦引导的组装。
通过力学建模，可以准确释放预定的载荷，实现在曲面上有序组装复杂三维结构的零件，本文中实例在弯曲基底上组装了几十个这类结构的零件。包括可调谐偶极子天线、水管内的流量传感器、能够与心脏共形整合的集成电子系统等。
上图为复杂三维结构在曲面上的有序装配策略的概念图。
(A) 用人脸的三维装饰面具的形成来说明有序装配策略。右边的两张图片对应的是银（5米）和PET（75米）双层中三维结构的有限元分析预测和光学图像。
(B) 上图是一个螺旋形基底和螺旋形基底的有限元分析结果，它可以被扭转和拉伸载荷压平。底部面板展示了三维叶状结构在螺旋形基底上的有序组装过程，以及有限元分析预测和光学成像图。
(C) 在圆柱形管子的内表面组装三维结构的概念图，在与二维前驱体整合之前，基材被斜着裁剪，通过弯曲变形压平，然后预拉伸。底部面板展示了圆柱形管内分层三维螺旋结构[铝（2.5米）/PET（30米）]的有序组装过程，并附有有限元分析预测和光学图像。
(D) 三维结构在具有莫比乌斯带形状的基底上的组装过程的说明，以及在基底上组装的蚁状结构[Al (2.5 m)/PET (30 m)]的有限元分析预测和光学图像。
上图为在可被压平的弯曲表面上组装的复杂的三维结构。
其中(A) 为马蹄形弯曲基底的示意图，它可以通过单轴拉伸压平。(B) 说明马蹄形基板上三维带状结构组装过程的光学图像。(C) 在不同程度的双轴拉伸下，半球形弹性体基底的生成矩阵轮廓的有限元分析和体验结果。R0表示初始半球的半径。(D) 在不同程度的双轴拉伸下，半球形基体的最大主应变轮廓的有限元分析预测。
(E) 为通过有限元分析预测，不同长度的直带（Lribbon）装配在半球形基底上的比较。(F) 组装在半球形基底的凸面和凹面上的各种三维结构的2D几何图形、FEA预测以及实验图像。
G到J：装配在半球形基底上的半椭圆形表面的逆向设计。(K到N)在半球形基底上不同空间位置组装的具有相同高度(hi)的小半球形的逆向设计。(O和P) 组装在类脑表面的螺旋形微尺度结构网络和微小的三维斜方体带状微尺度结构的光学图像。
上图为复杂三维结构在圆柱/类圆柱形表面的组装。
(A) 用作弯曲基底的主动脉模型的示意图，以及通过压缩屈曲在该基底上的螺旋和双螺旋结构的组装过程。
(B) 通过拉伸屈曲在圆柱形基底上装配不同长度的直条带的过程。
(C) 各种三维结构组装在圆柱形基底上的二维几何图形、有限元分析预测和实验图像。
(D)二维前体、有限元分析预测和通过拉伸屈曲形成的kirigami-inspired鳞片状三维结构的实验图像。
(E) 有限元分析预测和实验图像表明，在阿基米德螺旋纤维上的kirigami启发的尺度结构阵列的有序组装过程。
(F至H）在螺旋纤维上的不同空间区域组装具有相同高度和间距的螺旋结构的逆向设计。
本文通讯作者为张一慧博士，清华大学航天航空学院工程力学系长聘教授。
2011年在清华大学航天航天学院工程力学系获博士学位。2011年至2015年在美国西北大学土木与环境工程系先后担任Postdoctoral Fellow和Research Assistant Professor。2015年加入清华大学工程力学系，历任副教授、长聘副教授、长聘教授。
主要研究领域为力学引导的三维微结构组装，非常规软材料，柔性可延展电子器件，智能材料与结构力学
至今已获得授权的中国发明专利5项、美国发明专利3项，出版学术专著1部，发表SCI论文150余篇，其中以通讯作者在《Science》、《Nature》、《Nature Materials》、《Nature Electronics》、《Nature Reviews Materials》、《Nature Communications》、《Science Advances》、《PNAS》、《JMPS》、《Advanced Materials》、《ACS Nano》等期刊发表高水平学术论文80余篇。
两位共同一作Xue Zhaoguo和Jin Tianqi均来自清华大学工程力学系应用力学实验室。
Xue Zhaoguo主要负责概念化，数据整理，形式分析，资金获取，调查，方法学，项目管理，资源，软件，验证，可视化，论文写作、审查和编辑。
Jin Tianqi主要负责概念化、数据管理、形式分析、调查、方法论、软件、可视化和论文写作。
参考资料：
https://www.science.org/doi/10.1126/sciadv.abm6922、
http://yihuizhang.org/research.html
融界8月16日消息，有投资者在互动平台向瀚川智能提问：公司对4680大圆柱电池设备发展有何预判？
公司回答表示：4680大圆柱电池行业已出现新进展。公司将根据行业趋势与目标客户的投资扩产情况进行业务筹划。
本文源自金融界AI电报
一次看到在网上看到一个HTML5的VR街道的应用，印象比较深刻，觉得还挺有意思的。正好最近项目间隙，找点事情搞搞，所以找到一个WebVR的网页开发框架A-Frame。以下内容整理来自于踏得网的A-Frame中文教程。
虚拟现实（VR）是一种技术，使用头显设备产生逼真的图像，声音和其他感觉，使得用户进入身临其境的虚拟环境。VR允许我们创建无界的世界，人们可以使用手来控制虚拟世界中的行走和互动，仿佛他们被时空传送到另一个地方。如果说互联网打破了时空界限，那么虚拟实现将打破虚拟和现实的界限。
A-Frame是一款用来构建虚拟现实（VR）的网页开发框架，属于当下流行的开发WebVR解决方案。A-Frame是完全开源的框架，核心思想来自three.js，提供声明式、可拓展、组件化的编程结构，并且支持主流VR头显。
个人理解：通过A-Frame框架，将3D、VR、AR设计中的元素进行标签化，类似html里面的标签或者元素。常见到到标签有：
有些常用的实体标签进行封装，比如正方体、圆柱体、球之类。
有标签，就有标签的属性了。常见的属性值有：
然后就是各种类型的属性值了。开发的时候就是写各种元素根据需要向屏幕中进行堆叠就可以了。是不是跟你平时做的html开发没啥区别。
后面根据你项目需要可以自己写组件，根据特殊的需求，可以引入各种各样写好的插件，满足你的天马行空的想象。
就拿上面提到的元素标签来几段代码，做个效果。
<html> <head> <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script> </head> <body> <a-scene> <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box> <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere> <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane> <a-sky color="#ECECEC"></a-sky> </a-scene> </body> </html>
效果预览1
<html> <head> <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script> <script src="https://unpkg.com/aframe-physics-system@1.4.0/dist/aframe-physics-system.min.js"></script> </head> <body> <a-scene physics> <a-box position="-1 4 -3" rotation="0 45 0" color="#4CC3D9" dynamic-body></a-box> <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4" static-body></a-plane> <a-sky color="#ECECEC"></a-sky> </a-scene> </body> </html>
效果预览2
<html> <head> <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script> <script src="https://unpkg.com/aframe-animation-component@3.2.1/dist/aframe-animation-component.min.js"></script> <script src="https://unpkg.com/aframe-particle-system-component@1.0.x/dist/aframe-particle-system-component.min.js"></script> <script src="https://unpkg.com/aframe-extras.ocean@%5E3.5.x/dist/aframe-extras.ocean.min.js"></script> <script src="https://unpkg.com/aframe-gradient-sky@1.0.4/dist/gradientsky.min.js"></script> </head> <body> <a-scene> <a-entity id="rain" particle-system="preset: rain; color: #24CAFF; particleCount: 5000"></a-entity> <a-entity id="sphere" geometry="primitive: sphere" material="color: #EFEFEF; shader: flat" position="0 0.15 -5" light="type: point; intensity: 5" animation="property: position; easing: easeInOutQuad; dir: alternate; dur: 1000; to: 0 -0.10 -5; loop: true"></a-entity> <a-entity id="ocean" ocean="density: 20; width: 50; depth: 50; speed: 4" material="color: #9CE3F9; opacity: 0.75; metalness: 0; roughness: 1" rotation="-90 0 0"></a-entity> <a-entity id="sky" geometry="primitive: sphere; radius: 5000" material="shader: gradient; topColor: 235 235 245; bottomColor: 185 185 210" scale="-1 1 1"></a-entity> <a-entity id="light" light="type: ambient; color: #888"></a-entity> </a-scene> </body> </html>
效果预览3
自行运行上述代码试试。真正项目运行当然就需要web服务器了，前面引入JS，中间不断堆叠需要的实体、特效、交互、动画就可以了。不需要编译，直接预览就可以。
<!-- Production Version, Minified --> <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script> <!-- Development Version, Uncompressed with Source Maps --> <script src="https://aframe.io/releases/0.5.0/aframe.js"></script>
遇到一个小问题，本地html文件引入同文件资源，居然还产生跨域问题。
A-Frame支持的通用平台包括：
一些其他的平台包括：
当然前端开发要关心支持那些浏览器了，https://webvr.rocks维护最新列表。目前
A-Frame尝试通过WebVR polyfill来支持那些未实现WebVR接口的现代浏览器，但是由于不是官方支持，所以体验可能会不佳：
对于平面的3D渲染，A-Frame支持所有实现了WebGL接口的现代浏览器：
总之，万恶的IE
踏得网翻译是原语，百度翻译是基元。实际就是个语法糖，把一些常用的实体进行封装。方便理解学习，降低开发难度，本身也是实体。
比如 <a-box></a-box>实际是<a-entity geometry=”primitive: box;”></a-entity> 并且a-box增加属性，映射到a-entity的具体属性值中。
<a-box color="red" width="3"></a-box> //效果跟下方相同 <a-entity geometry="primitive: box; width: 3" material="color: red"></a-entity>
这种语法糖可以通过AFRAME.registerPrimitive(name, definition)进行注册，方法也很简单。举例：
AFRAME.registerPrimitive('a-ocean', {
defaultComponents: {
ocean: {},
rotation: {x: -90, y: 0, z: 0}
},
mappings: {
width: 'ocean.width',
depth: 'ocean.depth',
density: 'ocean.density',
color: 'ocean.color',
opacity: 'ocean.opacity'
}
});
其中，name是对应生成的新实体的名字，definition是新实体需要的参数对象。definition参数对象中包含defaultComponents和mappings，defaultComponents是新实体的默认参数，比如先指定下几何图形等等，mappings是对外暴露的属性值及在默认对象中的对应关系。
有没有一种面向对象开发中，a-entity是基础类，注册一个子类，继承父类，对外暴露特定接口的概念。
实体-组件-系统（entity-component-system），ECS架构是三维游戏中常见且理想的设计模式，Unity就是ECS架构的游戏引擎。A-Frame是基于three.js，并且使用了ECS架构。
ECS的基本定义包括：
对应aframe框架，类比HTML结构理解，就是 systems是html/body标签，Entities是div标签，Component是div标签上的style属性。
组件上的语法属性值和style的样式一样，可以添加很多。
<a-entity geometry="primitive: sphere; radius: 1.5" light="type: point; color: white; intensity: 2" material="color: white; shader: flat; src: glow.jpg" position="0 0 -5"></a-entity>
把元素堆叠起来是显示效果，当然我们还需要控制场景中的元素为我们所用。这里还是进行的DOM操作，
查询遍历方法
querySelector()和querySelectorAll()，借鉴Jquery。
<html> <a-scene> <a-box id="redBox" class="clickable" color="red"></a-box> <a-sphere class="clickable" color="blue"></a-sphere> <a-box color="green"></a-box> <a-entity light="type: ambient"></a-entity> <a-entity light="type: directional"></a-entity> </a-scene> </html>
声明对象可以使用下面一些方式进行声明。
var sceneEl=document.querySelector('a-scene'); //指定一个对象
var redBox=sceneEl.querySelector('#redBox'); //使用ID值
var boxs=sceneEl.querySelectorAll('a-box'); //选择一类实体
var btns=sceneEl.querySelectorAll('.clickable'); //使用class值
var lights=sceneEl.querySelectorAll('[light]'); //使用属性值
var els=sceneEl.querySelectorAll('*'); //使用通配符
对象属性操作
后续整个理解其实和正常的操作dom，使用的一样的方法和接口。
事件和侦听器
和浏览器事件相同，增加的事件可以通过.emit向外发射，.addEventListener进行侦听，.removeEventListener删除侦听。举例，空间里面两个对象碰到了就叫一声（emit），空间里面管理员听到了就会去处理。addEventListener就是增加管理员，里面代码是听到叫声要操作的事情。
entityEl.emit('physicscollided', {collidingEntity: anotherEntityEl}, false); //碰了就叫一声
function collisionHandler (event) {
console.log('Entity collided with', event.detail.collidingEntity);
}); //要做的时事情
entityEl.addEventListener('physicscollided', collisionHandler); //放侦听器处理
entityEl.removeEventListener('physicscollided', collisionHandler); //删除侦听器
A-Frame中元素也存在父子关系的嵌套，并且父子元素之间的空间关系也是相互影响的。
<a-scene> <a-box> <a-sphere></a-sphere> <a-light></a-light> </a-box> <a-entity id="foo" position="1 2 3"> <a-entity id="bar" position="2 3 4"></a-entity> </a-entity> </a-scene>
其中id为bar的实体的实际空间坐标就变成了（3, 5, 7）。最外层坐标叫世界坐标，元素里面的坐标是相对于父坐标的坐标。
A-Frame查看器是一个用来检测和修改场景元素的可视化工具。使用<ctrl> + <alt> + i组合快捷键来打开/关闭查看器，使用该工具，我们可以：
查看器类似于浏览器的DOM查看器，但面向的是3D上下文和A-Frame。
本文算是一个初期的入门理解，更加深入的理解肯定要实战中去增强理解，好多问题只有在多次实战运用之后才会又更深入的了解。而且像这种3D内容的开发，更多的其实是空间设计能力，这个才是重点。
人们,技术,未来和进步——未来的3d眼镜和微芯片植入物或蓝色背景的传感器与网络联系图标
*请认真填写需求信息，我们会在24小时内与您取得联系。
