解决windows下three.js在WebGlRender渲染无法设置线宽linewidth

imccl 发布于2019-08-20 18:17 / 1956人阅读

    var mesh = ""
    function createLines(arr) {    
        if(mesh){
            scene.remove(mesh)
        }
        var line = new THREE.Geometry();
        line.vertices = []
        $.each(arr, function(index,content) {
            var a = scene.getObjectByName(content)
            line.vertices.push( a.position );
        });
        makeLine( line, 3 );
    }
    
    var resolution = new THREE.Vector2( window.innerWidth, window.innerHeight );
    function makeLine( geo, c ) {
        var g = new MeshLine();

        g.setGeometry( geo );
    
        var material = new MeshLineMaterial( {
            useMap: false,
            color: new THREE.Color( 0xed6a5a ),
            opacity: 1,
            resolution: resolution,
            sizeAttenuation: !false,
            lineWidth: 0.5,
            near: camera.near,
            far: camera.far
        });
        mesh = new THREE.Mesh( g.geometry, material );
        scene.add( mesh );
    }
    //arr为line在场景中经过的模型名称的数组
    createLines(arr)

页面中需要引入
THREE.MeshLine.js下载

海外云主机服务器托管在windows下运行webrtc webrtc在安卓10下无法使用在windows系统下搭建私有云如何在windows下安装linux

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/84296.html

three.js 入门详解(一)

摘要：一般说来，对于制图建模软通常使正交投影，这样不会因为投影而改变物体比例而对于其他大多数应用，通常使用透视投影，因为这更接近人眼的观察效果。 showImg(https://segmentfault.com/img/remote/1460000012581680?w=1920&h=1080); 1. 概述 1.1 什么是WebGL？ WebGL是在浏览器中实现三维效果的一套规范想要使用...

Jacendfeng 2019-08-21 17:51 评论0 收藏0
canvas 绘制双线技巧

摘要：只有源图像外的目标图像部分会被显示，源图像是透明的。绘制了线路的图像是目标图像，线路是源图像。楔子最近一个项目，需要绘制双线的效果，双线效果表示的是轨道（类似铁轨之类的），如下图所示：负责这块功能开发的小伙，姑且称之为L吧，最开始是通过数学计算的方式来实现这种双线，也就是在原来的路径的基础上，计算出两条路径。但是这个过程的计算算挺复杂，而是最终实现的效果很耗性能，性能损耗估计主要...

王军 2019-08-23 14:11 评论0 收藏0