三维流动实现方法 ht for web

一. 类似水管内部水的流动

1. 两套模型。一套在外，作为管道。另一套在内作为水的流动
2. 在内管道贴图要求：颜色、透明相互交替。
3. 流动具体实现，在json中添加tag属性，在页面中通过g3d.dm().getDataByTag(“yellow”);获取对应的模型，在添加、更改属性

{
"c": "ht.Node",
"i": 19884,
"p": {
"tag": "propelled",
"rotationZ": -0.40143,
"position": {
"x": -0.00031,
"y": -369
},
"elevation": 129.36739
},

1. 三维的流动通过shape3d.uv.offset改变内在管道的贴图而实现流动

 

function yellow(offset1) {
var anim1 = ht.Default.startAnim({
duration: 2000,
action: function() {
offset1 += 0.015;
var pipelines = g3d.dm().getDataByTag("yellow");
pipelines.s("shape3d.uv.offset", [offset1, 0]);
},
finishFunc: function() {
yellow(offset1);
}
});
}

二、三维物体旋转（通过json加载）
1.给模型添加标签，表示不同的模型
{
"c": "ht.Node",
"i": 19884,
"p": {
"tag": "propelled",
"rotationZ": -0.40143,
"position": {
"x": -0.00031,
"y": -369
},
"elevation": 129.36739
},

2.通过该方法3d.dm().getDataByTag(“yellow”);得到模型
3.通过setRotationZ（值）旋转
function xuanzhuan(offset1) {
var anim1 = ht.Default.startAnim({
duration: 2000,
action: function(data) {
offset1 === 360 ? (offset1 = offset1 * -1) : (offset1 += 0.3);
var propelled1 = g3d.dm().getDataByTag("propelled"); //通过标签获得模型，从而进行操作
propelled1.setRotationZ(offset1);
console.log(propelled1);
},
finishFunc: function() {
xuanzhuan(offset1);
}
});
}

来源：oschina

链接：https://my.oschina.net/u/4403835/blog/3640832