Threejs中的文本缩放 - GridHelper

时间:2015-05-12 13:54:51

标签: javascript html three.js

我修改了GridHelper文件以允许不同大小的X轴和Y轴。现在我可以创建矩形作为网格。 我有兴趣添加文本比例而不会降低创建大量文本的性能。

感谢您的想法!

THREE.GridHelper = function ( sizeX, sizeY, step) {

var x = Math.round(sizeX/step);
var y = Math.round(sizeY/step);

sizeX = x*step;
sizeY = y*step;

var geometry = new THREE.Geometry();
var material = new THREE.LineBasicMaterial( { vertexColors: THREE.VertexColors } );

this.color1 = new THREE.Color( 0x444444 );
this.color2 = new THREE.Color( 0x888888 );

for ( var i = 0; i <= sizeX; i += step ) {

    geometry.vertices.push(
        new THREE.Vector3( i, 0, 0 ), 
        new THREE.Vector3( i, 0, sizeY )
    );

    var color = i === 0 ? this.color1 : this.color2;

    geometry.colors.push( color, color, color, color );

}

for ( var i = 0; i <= sizeY; i += step ) {

    geometry.vertices.push(
        new THREE.Vector3( 0, 0, i ), 
        new THREE.Vector3( sizeX, 0, i )
    );

    var color = i === 0 ? this.color1 : this.color2;

    geometry.colors.push( color, color, color, color );

}

THREE.Line.call( this, geometry, material, THREE.LinePieces );
};

THREE.GridHelper.prototype = Object.create( THREE.Line.prototype );

THREE.GridHelper.prototype.setColors = function( colorCenterLine, colorGrid ) {

this.color1.set( colorCenterLine );
this.color2.set( colorGrid );

this.geometry.colorsNeedUpdate = true;
}

0 个答案:

没有答案