Я работаю над помещением LineBasicMaterial в AFrame, но наткнулся на некоторые проблемы:

1. Переменные каким-то образом вводятся в схему и не могут быть извлечены без ошибок.

У меня есть коробка:

<a-box material="shader: linebasic;"></a-box>

И зарегистрировали собственный шейдер:

AFRAME.registerShader('linebasic', {
    schema: {
        blending:       {default: THREE.NormalBlending},
        color:          {type: 'color', default: 0xffffff, is: 'uniform'},
        depthTest:      {default: true},
        depthFunc:      {default: THREE.LessEqualDepth},
        depthWrite:     {default: true},
        fog:            {default: false},
        linewidth:      {default: 10},
        linecap:        {default: 'round'},
        linejoin:       {default: 'round'},
        needsUpdate:    {default: true},
        opacity:        {default: 1},
        side:           {default: THREE.FrontSide},
        transparent:    {default: true},
        vertexColors:   {default: THREE.NoColors},
        visible:        {default: true}
    },
    init: function (data) {
        console.log(data);
        delete data.flatShading;
        this.material = new THREE.LineBasicMaterial(data);
        this.update(data);
    },
    update: function (data) {
        this.material.clone(data);
    }
});

Каким-то образом был установлен data.flatShading, хотя на объекте и шейдере его нет. Вот почему я delete data.flatShading.

Еще одно свойство, которое также присутствует в данных, - shader. Если я удалю его, консоль выдаст мне следующее сообщение об ошибке:

компоненты: материал: ошибка Неизвестная схема шейдера undefined + 0 мс

Если я оставлю его, я получаю уведомление:

THREE.LineBasicMaterial: шейдер не является свойством этого материала.

Так или иначе, что-то явно не так.

ОБНОВЛЕНИЕ №1:

Следующие исправления # 1, опубликованные @ngokevin:

AFRAME.registerShader('linebasic', {
    schema: {
        blending:       {default: THREE.NormalBlending},
        color:          {type: 'color', default: 0xffffff, is: 'uniform'},
        depthTest:      {default: true},
        depthFunc:      {default: THREE.LessEqualDepth},
        depthWrite:     {default: true},
        fog:            {default: false},
        linewidth:      {default: 10},
        linecap:        {default: 'round'},
        linejoin:       {default: 'round'},
        needsUpdate:    {default: true},
        opacity:        {default: 1},
        side:           {default: THREE.FrontSide},
        transparent:    {default: true},
        vertexColors:   {default: THREE.NoColors},
        visible:        {default: true}
    },
    init: function (data) {
        data = AFRAME.utils.extend({}, data);
        delete data.flatShading;
        delete data.shader;
        this.material = new THREE.LineBasicMaterial(data);
        this.update(data);
    },
    update: function (data) {
        this.material.clone(data);
    }
});

2. LineBasicMaterial отображается как сплошной белый блок.

Несмотря на то, что я использую THREE.LineBasicMaterial со всеми его свойствами и множеством свойств THREE.Material, материал отображается не в виде линий, а в виде сплошного блока.

Материал и LineBasicMaterial не имеют «каркаса», поэтому я не знаю, как сделать это, не добавляя каркасный элемент и не «взламывая» LineBasicMaterial.

Номер 2 для меня сейчас наиболее важен, но я также хотел бы исправить 1. Я думаю, что они связаны, поэтому я задаю им один вопрос.