汽车obj模型在网页中有四个透视图

时间:2015-10-28 06:40:15

标签: 3d jsc3d

我正在使用jsc3d库wherin工作汽车obj模型我也将实时数据传递给它。但是,虽然它是现场的,但是由于加载时间或我们发送值的速度,图像是否会闪烁?

我确实想要它的四个视图,如带有实时动作的汽车模型的等距侧前视图和后视图。目前使用的obj是在jsc3d网站汽车模型中。

我发布了一张图片,其中我希望通过所有视图实现这一目标。

到目前为止我



  $(document).ready(function(){
        var v1=0;
        var v2=0;
        var v3=0;

        setInterval(function(){
            $.getJSON('value.php', function(data){
                //$('#ajaxContent').empty();
                $.each(data, function(entryIndex, entry){

                    v1 = entry.xaxis;
                    v2 = entry.yaxis;
                    v3 = entry.zaxis;
//                alert(v3);

                });

                var canvas = document.getElementById('cv');
                var viewer = new JSC3D.Viewer(canvas);
                viewer.setParameter('SceneUrl', 'bmw/bmw.obj');
                viewer.setParameter('InitRotationX', v1);
                viewer.setParameter('InitRotationY', v2);
                viewer.setParameter('InitRotationZ', v3);
                viewer.setParameter('ModelColor', '#0000');
                viewer.setParameter('BackgroundColor1', '#');
                //viewer.setParameter('BackgroundColor2', '#ffff');
                viewer.setParameter('RenderMode', 'texturesmooth');
                viewer.setParameter('ProgressBar', 'off');

                viewer.setParameter('definition', 'high');
                viewer.init();
                viewer.update();
                viewer.render();

                var ctx = canvas.getContext('2d');
            });
        },100);

    });



//var colorMenu = new Image;
//colorMenu.src = 'bmw/menu.gif';
//
//var isMenuOpen = false;
//var menuOffsetX = 10;
//var menuOffsetY = 10;
//var menuItems = [undefined, '#EFEBE0', '#FF9900', '#CC0000', '#330033', '#000066', '#003333'];

//function isMenuLoaded() {
//  return colorMenu.width > 0 && colorMenu.height > 0;
//}

//
//function whichMenuItem(x, y) {
//    if(
//        x >= menuOffsetX && x < menuOffsetX + colorMenu.width &&
//        y >= menuOffsetY && y < menuOffsetY + colorMenu.height)
//        return Math.floor((y - menuOffsetY) * menuItems.length /  colorMenu.height);
//
//    return -1;
//}


//viewer.onmouseup = function(x, y) {
//
//    var itemIndex = whichMenuItem(x, y);
//    if(isMenuOpen) {
//        if(itemIndex > 0) {
//            var item = menuItems[itemIndex];
//            changeCarBodyColor(parseInt(item.substring(1), 16));
//        }
//        else if(itemIndex == 0)
//        // fold menu
//            isMenuOpen = false;
//        // viewer.update(true); // do not generate new frame, just repaint it to apply the new menu state
//    }
//    else {
//        if(itemIndex == 0)
//        // unfold menu
//            isMenuOpen = true;
//        //  viewer.update(true); // do not generate new frame, just repaint it
//    }
//
//    updateCar();
//};

function setDefinition(definition) {
    if(viewer.getScene()) {
        viewer.setDefinition(definition);
        //  viewer.update();
    }
}
&#13;
<script type="text/javascript" src="jsc3d.js"></script>
		<script type="text/javascript" src="jsc3d.touch.js"></script>
		<script type="text/javascript" src="jsc3d.webgl.js"></script>




<canvas id="cv" style="border: 1px solid;" width="200"  height="180" ></canvas>
&#13;
&#13;
&#13;

enter image description here我可以将值传递给它,也可以传输数据。

1 个答案:

答案 0 :(得分:0)

你每100毫秒创建一个新的观众...

初始化代码只能为每个观看者执行一次,之后您只需要用新值更新现有的查看器实例。

初始参数的“等效”

InitRotationX,InitRotationY,InitRotationZ

viewer.rotMatrix.rotateAboutXAxis(v1);
viewer.rotMatrix.rotateAboutYAxis(v2);
viewer.rotMatrix.rotateAboutZAxis(v3);
顺便说一句,注意如果你需要在初始查看器参数设置后通过代码更新模型旋转,旋转不是可交换的 - 而且,在应用所需的旋转之前,你可能需要重置旋转矩阵,如下所示:

viewer.rotMatrix.identity();