小编Jar*_*red的帖子

在球体表面包装不规则圆圈

我正在使用THREE.js在球体上创建点,类似于元素周期表示例

我的数据集是一个不规则大小的圆圈,我希望将它们均匀地分布在球体表面周围.经过几个小时的网络搜索,我意识到这比听起来困难得多.

以下是这个想法的实例:

VIMEO

PIC

circlePack java applet

任何人都可以帮我指点找到一个允许我这样做的算法吗?打包率不需要非常高,理想情况下,它可以快速轻松地在javascript中进行计算,以便在THREE.js(笛卡尔坐标系或坐标系)中进行渲染.效率是关键.

编辑:圆半径可以广泛变化.以下是使用周期表代码的示例: 例

javascript algorithm geometry three.js circle-pack

11
推荐指数
2
解决办法
1149
查看次数

顶点着色器中的广告牌顶点

代码演示问题(注释/取消注释gl_Position顶点着色器中的行)

    var scene;
    var book;
    var shaderMaterial;

    var renderer = new THREE.WebGLRenderer({
        antialias: true
    });
    renderer.setClearColor(0x000000);
    document.body.appendChild(renderer.domElement);

    var camera = new THREE.PerspectiveCamera(55, 1, 0.1, 40000);


    window.onresize = function () {
        renderer.setSize(window.innerWidth, window.innerHeight);
        camera.aspect = window.innerWidth / window.innerHeight;
        camera.updateProjectionMatrix();
    };
    window.onresize();

    scene = new THREE.Scene();

    camera.position.z = 25;
    camera.position.y = 15;
    scene.add(camera);


    var grid = new THREE.GridHelper(100, 10);
    scene.add(grid);


    var controls = new THREE.OrbitControls(camera);
    controls.damping = 0.2;
    var lettersPerSide = 16;

    function createGlpyhSheet() {

        var fontSize = 64;

        var …
Run Code Online (Sandbox Code Playgroud)

shader glsl webgl vertex-shader three.js

5
推荐指数
1
解决办法
631
查看次数

我怎样才能更新 THREE.Sprite 颜色

jsfiddle在这里

我创建了一个具有默认颜色的材质,在本例中为0xffffff

后来,我想改变颜色。我不知道在哪里改变它 -particle.color = 0xffffff * Math.random();不起作用。没有particle.color,但是有一个particle.material.color,如果我改变它会给我一个错误。

我是否需要为每个精灵创建新材质?有没有办法可以简单地更改 THREE.Sprite 的颜色?

var material = new THREE.SpriteCanvasMaterial({
        color: 0xffffff,
        program: function (context) {
            context.beginPath();
            context.arc(0, 0, 0.5, 0, PI2, true);
            context.fill();
        }
    });

    for (var i = 0; i < 50; i++) {

        particle = new THREE.Sprite(material);
        particle.position.x = Math.random() * 2 - 1;
        particle.position.y = Math.random() * 2 - 1;
        particle.position.z = Math.random() * 2 - 1;
        particle.position.normalize();
        particle.position.multiplyScalar(Math.random() * 10 + …
Run Code Online (Sandbox Code Playgroud)

sprite three.js

1
推荐指数
1
解决办法
1899
查看次数

从包含转义字符的字符串中提取键值对

这个问题建立在: 从包含键值对的字符串中获取python字典

我想得到包含等于符号转义的值的键值对.

r = "key1=value1 key2=value2 request=http://www.pandora.com/json/music/artist/justin-moore?explicit\\=false uri=3DLoiRDsBABCAA9FvE1htRg\\=\\="
regex = re.compile(r"\b(\w+)=([^=]*)(?=\s\w+=\s*|$)")
d = dict(regex.findall(r))
print(d)

{'key2': 'value2', 'key1': 'value1'}
Run Code Online (Sandbox Code Playgroud)

我似乎无法获得带有转义等号的值.我很确定([^ =]*)部分是错误的.我想我需要匹配任何不包含下一个键的东西=

python regex escaping key

0
推荐指数
1
解决办法
4843
查看次数

GPU拾取-精灵周围的不可见像素

我正在渲染一个包含精灵的采摘场景。当我的光标靠近精灵时,它注册为一种颜色并被“选中”。放大小精灵时,此不可见的边框会变大。

打开控制台以查看实时打印的ID。将光标移近或移远,移至大和小的精灵。您会看到精灵在不可见的边框上被选中。对于常规几何图形,仅对于精灵,不会发生此行为。

这很奇怪,因为我正在渲染renderer.readRenderTargetPixels实际看到的东西。

如何摆脱看不见的边界,以进行更准确的拾取?

在此处输入图片说明

var renderer, scene, camera, controls;

var particles, uniforms;

var PARTICLE_SIZE = 50;

var raycaster, intersects;
var mouse, INTERSECTED;

var pickingTexture;

var numOfVertices;

init();
animate();

function init() {

    container = document.getElementById('container');

    scene = new THREE.Scene();

    camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 10000);
    camera.position.z = 150;

    //

    var geometry1 = new THREE.BoxGeometry(200, 200, 200, 4, 4, 4);
    var vertices = geometry1.vertices;
    numOfVertices = vertices.length;

    var positions = new Float32Array(vertices.length * 3);
    var colors = …
Run Code Online (Sandbox Code Playgroud)

picking mouse-picking three.js

0
推荐指数
1
解决办法
621
查看次数