Store vertex colors in mesh.

This commit is contained in:
kovacsv 2021-12-28 16:44:00 +01:00
parent 4027e2bc42
commit 3a5c65bdc8
35 changed files with 1326 additions and 43 deletions

View File

@ -15,6 +15,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -15,6 +15,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -15,6 +15,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -15,6 +15,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -15,6 +15,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -14,6 +14,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -15,6 +15,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -15,6 +15,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -14,6 +14,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -14,6 +14,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -0,0 +1,15 @@
OV.Coord4D = class
{
constructor (x, y, z, w)
{
this.x = x;
this.y = y;
this.z = z;
this.w = w;
}
Clone ()
{
return new OV.Coord4D (this.x, this.y, this.z, this.w);
}
};

View File

@ -121,6 +121,13 @@ OV.GltfBufferReader = class
let z = this.ReadComponent ();
this.SkipBytesByStride (3);
return new OV.Coord3D (x, y, z);
} else if (this.dataType === OV.GltfDataType.VEC4) {
let x = this.ReadComponent ();
let y = this.ReadComponent ();
let z = this.ReadComponent ();
let w = this.ReadComponent ();
this.SkipBytesByStride (4);
return new OV.Coord4D (x, y, z, w);
}
return null;
}
@ -353,6 +360,15 @@ OV.GltfExtensions = class
attributeArray[i + 2]
));
}
} else if (numComponents === 4) {
for (let i = 0; i < attributeArray.length; i += 4) {
processor (new OV.Coord4D (
attributeArray[i + 0],
attributeArray[i + 1],
attributeArray[i + 2],
attributeArray[i + 3]
));
}
}
draco._free (attributePtr);
}
@ -385,6 +401,7 @@ OV.GltfExtensions = class
}
let hasVertices = (extensionParams.attributes.POSITION !== undefined);
let hasVertexColors = (extensionParams.attributes.COLOR_0 !== undefined);
let hasNormals = (extensionParams.attributes.NORMAL !== undefined);
let hasUVs = (extensionParams.attributes.TEXCOORD_0 !== undefined);
@ -400,6 +417,13 @@ OV.GltfExtensions = class
mesh.AddVertex (vertex);
});
if (hasVertexColors) {
EnumerateComponents (this.draco, decoder, dracoMesh, extensionParams.attributes.COLOR_0, (vertexColor) => {
let color = new OV.Color (vertexColor.x * 255.0, vertexColor.y * 255.0, vertexColor.z * 255.0);
mesh.AddVertexColor (color);
});
}
if (hasNormals) {
EnumerateComponents (this.draco, decoder, dracoMesh, extensionParams.attributes.NORMAL, (normal) => {
mesh.AddNormal (normal);
@ -778,6 +802,7 @@ OV.ImporterGltf = class extends OV.ImporterBase
}
let hasVertices = (primitive.attributes.POSITION !== undefined);
let hasVertexColors = (primitive.attributes.COLOR_0 !== undefined);
let hasNormals = (primitive.attributes.NORMAL !== undefined);
let hasUVs = (primitive.attributes.TEXCOORD_0 !== undefined);
let hasIndices = (primitive.indices !== undefined);
@ -807,6 +832,18 @@ OV.ImporterGltf = class extends OV.ImporterBase
return;
}
if (hasVertexColors) {
let accessor = gltf.accessors[primitive.attributes.COLOR_0];
let reader = this.GetReaderFromAccessor (gltf, accessor);
if (reader === null) {
return;
}
reader.EnumerateData ((data) => {
let color = new OV.Color (data.x * 255.0, data.y * 255.0, data.z * 255.0);
mesh.AddVertexColor (color);
});
}
if (hasNormals) {
let accessor = gltf.accessors[primitive.attributes.NORMAL];
let reader = this.GetReaderFromAccessor (gltf, accessor);

View File

@ -97,38 +97,9 @@ OV.PlyMaterialHandler = class
constructor (model)
{
this.model = model;
this.vertexColors = [];
this.colorToMaterial = {};
}
AddVertexColor (color)
{
this.vertexColors.push (color);
}
GetTriangleColor (v0, v1, v2)
{
let vertexCount = this.vertexColors.length;
if (v0 >= vertexCount || v1 >= vertexCount || v2 >= vertexCount) {
return null;
}
return this.vertexColors[v0];
}
GetTriangleFaceMaterialIndex (color)
{
return this.GetMaterialIndexByColor (color);
}
GetTriangleVertexMaterialIndex (v0, v1, v2)
{
let color = this.GetTriangleColor (v0, v1, v2);
if (color === null) {
return null;
}
return this.GetMaterialIndexByColor (color);
}
GetMaterialIndexByColor (color)
{
let materialName = 'Color ' +
@ -397,7 +368,7 @@ OV.ImporterPly = class extends OV.ImporterBase
let z = ReadByFormat (reader, element.format[2]);
let color = SkipAndGetColor (reader, element.format, 3);
if (color !== null) {
materialHandler.AddVertexColor (color);
this.mesh.AddVertexColor (new OV.Color (color[0], color[1], color[2]));
}
this.mesh.AddVertex (new OV.Coord3D (x, y, z));
}
@ -411,9 +382,7 @@ OV.ImporterPly = class extends OV.ImporterBase
let v2 = vertices[i + 2];
let triangle = new OV.Triangle (v0, v1, v2);
if (faceColor !== null) {
triangle.mat = materialHandler.GetTriangleFaceMaterialIndex (faceColor);
} else {
triangle.mat = materialHandler.GetTriangleVertexMaterialIndex (v0, v1, v2);
triangle.mat = materialHandler.GetMaterialIndexByColor (faceColor);
}
this.mesh.AddTriangle (triangle);
}

View File

@ -100,6 +100,8 @@ OV.MaterialBase = class
this.name = '';
this.color = new OV.Color (0, 0, 0);
this.vertexColors = false;
}
IsEqual (rhs)
@ -116,6 +118,9 @@ OV.MaterialBase = class
if (!OV.ColorIsEqual (this.color, rhs.color)) {
return false;
}
if (this.vertexColors !== rhs.vertexColors) {
return false;
}
return true;
}
};

View File

@ -4,6 +4,7 @@ OV.Mesh = class extends OV.ModelObject3D
{
super ();
this.vertices = [];
this.vertexColors = [];
this.normals = [];
this.uvs = [];
this.triangles = [];
@ -14,6 +15,11 @@ OV.Mesh = class extends OV.ModelObject3D
return this.vertices.length;
}
VertexColorCount ()
{
return this.vertexColors.length;
}
NormalCount ()
{
return this.normals.length;
@ -45,6 +51,22 @@ OV.Mesh = class extends OV.ModelObject3D
return this.vertices[index];
}
AddVertexColor (color)
{
this.vertexColors.push (color);
return this.vertexColors.length - 1;
}
SetVertexColor (index, color)
{
this.vertexColors[index] = color;
}
GetVertexColor (index)
{
return this.vertexColors[index];
}
AddNormal (normal)
{
this.normals.push (normal);

View File

@ -1,6 +1,6 @@
OV.FinalizeModel = function (model, getDefaultMaterial)
{
function FinalizeMesh (mesh, getDefaultMaterialIndex)
function FinalizeMesh (model, mesh, getDefaultMaterialIndex)
{
function CalculateCurveNormals (mesh)
{
@ -104,6 +104,17 @@ OV.FinalizeModel = function (model, getDefaultMaterial)
if (status.calculateCurveNormals) {
CalculateCurveNormals (mesh);
}
let hasVertexColors = (mesh.VertexCount () === mesh.VertexColorCount ());
if (hasVertexColors) {
for (let i = 0; i < mesh.TriangleCount (); i++) {
let triangle = mesh.GetTriangle (i);
if (triangle.mat !== null) {
let material = model.GetMaterial (triangle.mat);
material.vertexColors = true;
}
}
}
}
let defaultMaterialIndex = null;
@ -123,7 +134,7 @@ OV.FinalizeModel = function (model, getDefaultMaterial)
i = i - 1;
continue;
}
FinalizeMesh (mesh, getDefaultMaterialIndex);
FinalizeMesh (model, mesh, getDefaultMaterialIndex);
}
let rootNode = model.GetRootNode ();

View File

@ -122,9 +122,13 @@ OV.ConvertModelToThreeObject = function (model, params, output, callbacks)
let material = model.GetMaterial (materialIndex);
let baseColor = new THREE.Color (material.color.r / 255.0, material.color.g / 255.0, material.color.b / 255.0);
if (material.vertexColors) {
baseColor.setRGB (1.0, 1.0, 1.0);
}
let materialParams = {
color : baseColor,
vertexColors : material.vertexColors,
opacity : material.opacity,
transparent : material.transparent,
alphaTest : material.alphaTest,
@ -210,9 +214,10 @@ OV.ConvertModelToThreeObject = function (model, params, output, callbacks)
let threeGeometry = new THREE.BufferGeometry ();
let meshThreeMaterials = [];
let meshOriginalMaterials = [];
let modelToThreeMaterials = {};
let modelToThreeMaterials = new Map ();
let vertices = [];
let vertexColors = [];
let normals = [];
let uvs = [];
@ -222,7 +227,8 @@ OV.ConvertModelToThreeObject = function (model, params, output, callbacks)
end : -1
});
let meshHasUVs = mesh.TextureUVCount () > 0;
let meshHasVertexColors = (mesh.VertexCount () === mesh.VertexColorCount ());
let meshHasUVs = (mesh.TextureUVCount () > 0);
for (let i = 0; i < triangleIndices.length; i++) {
let triangleIndex = triangleIndices[i];
let triangle = mesh.GetTriangle (triangleIndex);
@ -232,6 +238,17 @@ OV.ConvertModelToThreeObject = function (model, params, output, callbacks)
let v2 = mesh.GetVertex (triangle.v2);
vertices.push (v0.x, v0.y, v0.z, v1.x, v1.y, v1.z, v2.x, v2.y, v2.z);
if (meshHasVertexColors) {
let vc0 = mesh.GetVertexColor (triangle.v0);
let vc1 = mesh.GetVertexColor (triangle.v1);
let vc2 = mesh.GetVertexColor (triangle.v2);
vertexColors.push (
vc0.r / 255.0, vc0.g / 255.0, vc0.b / 255.0,
vc1.r / 255.0, vc1.g / 255.0, vc1.b / 255.0,
vc2.r / 255.0, vc2.g / 255.0, vc2.b / 255.0
);
}
let n0 = mesh.GetNormal (triangle.n0);
let n1 = mesh.GetNormal (triangle.n1);
let n2 = mesh.GetNormal (triangle.n2);
@ -247,10 +264,8 @@ OV.ConvertModelToThreeObject = function (model, params, output, callbacks)
}
let modelMaterialIndex = triangle.mat;
let materialIndex = modelToThreeMaterials[modelMaterialIndex];
if (materialIndex === undefined) {
materialIndex = meshThreeMaterials.length;
modelToThreeMaterials[modelMaterialIndex] = materialIndex;
if (!modelToThreeMaterials.has (modelMaterialIndex)) {
modelToThreeMaterials.set (modelMaterialIndex, meshThreeMaterials.length);
meshThreeMaterials.push (modelThreeMaterials[modelMaterialIndex]);
meshOriginalMaterials.push (modelMaterialIndex);
if (i > 0) {
@ -266,6 +281,9 @@ OV.ConvertModelToThreeObject = function (model, params, output, callbacks)
groups[groups.length - 1].end = triangleCount - 1;
threeGeometry.setAttribute ('position', new THREE.Float32BufferAttribute (vertices, 3));
if (vertexColors.length !== 0) {
threeGeometry.setAttribute ('color', new THREE.Float32BufferAttribute (vertexColors, 3));
}
threeGeometry.setAttribute ('normal', new THREE.Float32BufferAttribute (normals, 3));
if (uvs.length !== 0) {
threeGeometry.setAttribute ('uv', new THREE.Float32BufferAttribute (uvs, 2));

View File

@ -0,0 +1,8 @@
# Box Vertex Colors
## Screenshot
![screenshot](screenshot/screenshot.png)
## License Information
Donated by Michael Feldstein for glTF testing.

View File

@ -0,0 +1,220 @@
{
"accessors": [
{
"bufferView": 0,
"byteOffset": 0,
"componentType": 5123,
"count": 36,
"type": "SCALAR"
},
{
"bufferView": 1,
"byteOffset": 0,
"componentType": 5126,
"count": 24,
"max": [
0.5,
0.5,
0.5
],
"min": [
-0.5,
-0.5,
-0.5
],
"type": "VEC3"
},
{
"bufferView": 2,
"byteOffset": 0,
"componentType": 5126,
"count": 24,
"type": "VEC3"
},
{
"bufferView": 3,
"byteOffset": 0,
"componentType": 5126,
"count": 24,
"type": "VEC4"
},
{
"bufferView": 4,
"byteOffset": 0,
"componentType": 5126,
"count": 24,
"type": "VEC2"
}
],
"asset": {
"generator": "FBX2glTF",
"version": "2.0"
},
"bufferViews": [
{
"buffer": 0,
"byteLength": 72,
"byteOffset": 0,
"target": 34963
},
{
"buffer": 0,
"byteLength": 288,
"byteOffset": 72,
"target": 34962
},
{
"buffer": 0,
"byteLength": 288,
"byteOffset": 360,
"target": 34962
},
{
"buffer": 0,
"byteLength": 384,
"byteOffset": 648,
"target": 34962
},
{
"buffer": 0,
"byteLength": 192,
"byteOffset": 1032,
"target": 34962
}
],
"buffers": [
{
"byteLength": 1224,
"uri": "data:application/octet-stream;base64,AAABAAIAAQAAAAMABAAFAAYABwAEAAYACAAJAAoACwAJAAgADAANAA4ADQAMAA8AEAARABIAEAASABMAFAAVABYAFAAWABcAAAAAvwAAAD8AAAC/AAAAPwAAAD8AAAA/AAAAPwAAAD8AAAC/AAAAvwAAAD8AAAA/AAAAvwAAAD8AAAA/AAAAvwAAAD8AAAC/AAAAvwAAAL8AAAC/AAAAvwAAAL8AAAA/AAAAPwAAAD8AAAA/AAAAvwAAAL8AAAA/AAAAPwAAAL8AAAA/AAAAvwAAAD8AAAA/AAAAPwAAAD8AAAC/AAAAPwAAAL8AAAA/AAAAPwAAAL8AAAC/AAAAPwAAAD8AAAA/AAAAPwAAAL8AAAC/AAAAvwAAAL8AAAC/AAAAvwAAAD8AAAC/AAAAPwAAAD8AAAC/AAAAPwAAAL8AAAA/AAAAvwAAAL8AAAA/AAAAvwAAAL8AAAC/AAAAPwAAAL8AAAC/AAAAAAAAgD8AAAAAAAAAAAAAgD8AAAAAAAAAAAAAgD8AAAAAAAAAAAAAgD8AAAAAAACAvwAAAAAAAAAAAACAvwAAAAAAAAAAAACAvwAAAAAAAAAAAACAvwAAAAAAAAAAAAAAAAAAAAAAAIA/AAAAAAAAAAAAAIA/AAAAAAAAAAAAAIA/AAAAAAAAAAAAAIA/AACAPwAAAAAAAAAAAACAPwAAAAAAAAAAAACAPwAAAAAAAAAAAACAPwAAAAAAAAAAAAAAAAAAAAAAAIC/AAAAAAAAAAAAAIC/AAAAAAAAAAAAAIC/AAAAAAAAAAAAAIC/AAAAAAAAgL8AAAAAAAAAAAAAgL8AAAAAAAAAAAAAgL8AAAAAAAAAAAAAgL8AAAAAHekGMHp6JTz+/38/UdInMBHtfz9SNZs6rTHKPJsTwTrvy00/XMpNP0HLTT8AAIA/3ssCP4z/fz+gF+43whYUON7LAj+M/38/oBfuN8IWFDgd6QYwenolPP7/fz9R0icw6vR/PwjDNTqNSsY80xtiOu/LTT9cyk0/QctNPwAAgD8R7X8/UjWbOq0xyjybE8E678tNP1zKTT9By00/AACAP6bmIzurlgY+BNh/P0ziSzveywI/jP9/P6AX7jfCFhQ478tNP1zKTT9By00/AACAP6bmIzurlgY+BNh/P0ziSzsSAI885Oh+PxdguT574rE8Ee1/P1I1mzqtMco8mxPBOhIAjzzk6H4/F2C5PnvisTzq9H8/CMM1Oo1KxjzTG2I6HekGMHp6JTz+/38/UdInMO/LTT9cyk0/QctNPwAAgD+m5iM7q5YGPgTYfz9M4ks778tNP1zKTT9By00/AACAP+r0fz8IwzU6jUrGPNMbYjoSAI885Oh+PxdguT574rE8AACAPgAAAAAAAAA/qqqqPgAAAD8AAAAAAACAPqqqqj4AAIA+qqqqPgAAAACqqqo+AAAAAKqqKj8AAIA+qqoqPwAAAD+qqqo+AACAPqqqKj8AAAA/qqoqPwAAgD6qqqo+AABAP6qqqj4AAAA/qqoqPwAAQD+qqio/AAAAP6qqqj4AAEA/qqoqPwAAgD+qqio/AACAP6qqqj4AAEA/qqqqPgAAAD+qqio/AACAPqqqKj8AAIA+AACAPwAAAD8AAIA/"
}
],
"materials": [
{
"name": "Default",
"pbrMetallicRoughness": {
"baseColorFactor": [
0.800000011920929,
0.800000011920929,
0.800000011920929,
1.0
],
"metallicFactor": 0.100000001490116,
"roughnessFactor": 0.990000005960464
}
}
],
"meshes": [
{
"name": "Cube",
"primitives": [
{
"attributes": {
"COLOR_0": 3,
"NORMAL": 2,
"POSITION": 1,
"TEXCOORD_0": 4
},
"indices": 0,
"material": 0,
"mode": 4
}
]
}
],
"nodes": [
{
"children": [
1,
2,
3
],
"name": "RootNode",
"rotation": [
0.0,
0.0,
0.0,
1.0
],
"scale": [
1.0,
1.0,
1.0
],
"translation": [
0.0,
0.0,
0.0
]
},
{
"name": "Mesh",
"rotation": [
0.0,
0.0,
0.0,
1.0
],
"scale": [
1.0,
1.0,
1.0
],
"translation": [
0.0,
0.0,
0.0
]
},
{
"mesh": 0,
"name": "Cube",
"rotation": [
0.0,
0.0,
0.0,
1.0
],
"scale": [
1.0,
1.0,
1.0
],
"translation": [
0.0,
0.0,
0.0
]
},
{
"name": "Texture Group",
"rotation": [
0.0,
0.0,
0.0,
1.0
],
"scale": [
1.0,
1.0,
1.0
],
"translation": [
0.0,
0.0,
0.0
]
}
],
"samplers": [
{}
],
"scene": 0,
"scenes": [
{
"name": "Root Scene",
"nodes": [
0
]
}
]
}

View File

@ -0,0 +1,220 @@
{
"accessors": [
{
"bufferView": 0,
"byteOffset": 0,
"componentType": 5123,
"count": 36,
"type": "SCALAR"
},
{
"bufferView": 1,
"byteOffset": 0,
"componentType": 5126,
"count": 24,
"max": [
0.5,
0.5,
0.5
],
"min": [
-0.5,
-0.5,
-0.5
],
"type": "VEC3"
},
{
"bufferView": 2,
"byteOffset": 0,
"componentType": 5126,
"count": 24,
"type": "VEC3"
},
{
"bufferView": 3,
"byteOffset": 0,
"componentType": 5126,
"count": 24,
"type": "VEC4"
},
{
"bufferView": 4,
"byteOffset": 0,
"componentType": 5126,
"count": 24,
"type": "VEC2"
}
],
"asset": {
"generator": "FBX2glTF",
"version": "2.0"
},
"bufferViews": [
{
"buffer": 0,
"byteLength": 72,
"byteOffset": 0,
"target": 34963
},
{
"buffer": 0,
"byteLength": 288,
"byteOffset": 72,
"target": 34962
},
{
"buffer": 0,
"byteLength": 288,
"byteOffset": 360,
"target": 34962
},
{
"buffer": 0,
"byteLength": 384,
"byteOffset": 648,
"target": 34962
},
{
"buffer": 0,
"byteLength": 192,
"byteOffset": 1032,
"target": 34962
}
],
"buffers": [
{
"byteLength": 1224,
"uri": "buffer.bin"
}
],
"materials": [
{
"name": "Default",
"pbrMetallicRoughness": {
"baseColorFactor": [
0.800000011920929,
0.800000011920929,
0.800000011920929,
1.0
],
"metallicFactor": 0.100000001490116,
"roughnessFactor": 0.990000005960464
}
}
],
"meshes": [
{
"name": "Cube",
"primitives": [
{
"attributes": {
"COLOR_0": 3,
"NORMAL": 2,
"POSITION": 1,
"TEXCOORD_0": 4
},
"indices": 0,
"material": 0,
"mode": 4
}
]
}
],
"nodes": [
{
"children": [
1,
2,
3
],
"name": "RootNode",
"rotation": [
0.0,
0.0,
0.0,
1.0
],
"scale": [
1.0,
1.0,
1.0
],
"translation": [
0.0,
0.0,
0.0
]
},
{
"name": "Mesh",
"rotation": [
0.0,
0.0,
0.0,
1.0
],
"scale": [
1.0,
1.0,
1.0
],
"translation": [
0.0,
0.0,
0.0
]
},
{
"mesh": 0,
"name": "Cube",
"rotation": [
0.0,
0.0,
0.0,
1.0
],
"scale": [
1.0,
1.0,
1.0
],
"translation": [
0.0,
0.0,
0.0
]
},
{
"name": "Texture Group",
"rotation": [
0.0,
0.0,
0.0,
1.0
],
"scale": [
1.0,
1.0,
1.0
],
"translation": [
0.0,
0.0,
0.0
]
}
],
"samplers": [
{}
],
"scene": 0,
"scenes": [
{
"name": "Root Scene",
"nodes": [
0
]
}
]
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

View File

@ -0,0 +1,11 @@
# Vertex Color Test
## Screenshot
![screenshot](screenshot/screenshot.png)
## Description
This model tests the attribute semantic `COLOR_0`, as defined in the glTF [Metallic Roughness Material](https://github.com/KhronosGroup/glTF/tree/master/specification/2.0#metallic-roughness-material), to check if it has been multipled by `baseColor`. For engines that read the vertex colors and apply them, you should see two rows of checkmarks, as shown in the screenshot. The top row is the "Test" row, which has been multipled by red, green, and blue vertex colors to reveal checkmarks in the corresponding color channels. The bottom row is a "sample pass" row, where checkmarks of each color are multiplied by white and should appear the same as the screenshot regardless of the rendering engine's ability to process vertex colors.
For engines that ignore vertex colors, the top row of checks will look noticably mangled. The red check has a cyan X, the green check has a magenta X, and the blue check has a yellow X, occupying the other two color channels of each test checkmark. If you see these "X" marks fighting with the checkmarks, then you are seeing color channels that are supposed to have been zeroed out by the applied vertex colors on the mesh, and it means your rendering engine has not applied the vertex colors.

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.5 KiB

View File

@ -0,0 +1,366 @@
{
"accessors" : [
{
"bufferView" : 0,
"componentType" : 5121,
"count" : 36,
"max" : [
23
],
"min" : [
0
],
"type" : "SCALAR"
},
{
"bufferView" : 1,
"componentType" : 5126,
"count" : 24,
"max" : [
0.7554783821105957,
-0.8512416481971741,
0.9750328660011292
],
"min" : [
-0.7045658230781555,
-0.8512417078018188,
-0.9611154794692993
],
"type" : "VEC3"
},
{
"bufferView" : 2,
"componentType" : 5126,
"count" : 24,
"max" : [
0.0,
1.0,
-0.0
],
"min" : [
0.0,
1.0,
-0.0
],
"type" : "VEC3"
},
{
"bufferView" : 3,
"componentType" : 5126,
"count" : 24,
"max" : [
1.0,
7.121938949694595e-08,
1.5105192119335697e-07,
1.0
],
"min" : [
1.0,
-1.4348813692777185e-07,
-1.1257676391096538e-07,
1.0
],
"type" : "VEC4"
},
{
"bufferView" : 4,
"componentType" : 5126,
"count" : 24,
"max" : [
0.9999998807907104,
0.8010409474372864
],
"min" : [
0.0,
0.05539727210998535
],
"type" : "VEC2"
},
{
"bufferView" : 5,
"componentType" : 5121,
"count" : 72,
"max" : [
47
],
"min" : [
0
],
"type" : "SCALAR"
},
{
"bufferView" : 6,
"componentType" : 5126,
"count" : 48,
"max" : [
1.0000004768371582,
1.0,
0.48742246627807617
],
"min" : [
-1.0000003576278687,
-1.0,
-0.1718665361404419
],
"type" : "VEC3"
},
{
"bufferView" : 7,
"componentType" : 5126,
"count" : 48,
"max" : [
1.0,
1.0,
1.0
],
"min" : [
-1.0,
-1.0,
-1.0
],
"type" : "VEC3"
},
{
"bufferView" : 8,
"componentType" : 5126,
"count" : 48,
"max" : [
1.0,
7.940933880509066e-23,
4.470348358154297e-08,
1.0
],
"min" : [
1.0,
-6.617444900424222e-24,
-0.0,
1.0
],
"type" : "VEC4"
},
{
"bufferView" : 9,
"componentType" : 5126,
"count" : 48,
"max" : [
0.8361296057701111,
0.7666319012641907
],
"min" : [
0.22613045573234558,
0.2321176528930664
],
"type" : "VEC2"
},
{
"bufferView" : 10,
"componentType" : 5126,
"count" : 48,
"max" : [
1.0,
1.0,
1.0,
1.0
],
"min" : [
0.0,
0.0,
0.0,
1.0
],
"type" : "VEC4"
}
],
"asset" : {
"copyright": "Copyright 2018 Analytical Graphics, Inc., CC-BY 4.0 https://creativecommons.org/licenses/by/4.0/ - Mesh and textures by Ed Mackey.",
"generator" : "Khronos Blender glTF 2.0 exporter",
"version" : "2.0"
},
"bufferViews" : [
{
"buffer" : 0,
"byteLength" : 36,
"byteOffset" : 0,
"target" : 34963
},
{
"buffer" : 0,
"byteLength" : 288,
"byteOffset" : 36,
"target" : 34962
},
{
"buffer" : 0,
"byteLength" : 288,
"byteOffset" : 324,
"target" : 34962
},
{
"buffer" : 0,
"byteLength" : 384,
"byteOffset" : 612,
"target" : 34962
},
{
"buffer" : 0,
"byteLength" : 192,
"byteOffset" : 996,
"target" : 34962
},
{
"buffer" : 0,
"byteLength" : 72,
"byteOffset" : 1188,
"target" : 34963
},
{
"buffer" : 0,
"byteLength" : 576,
"byteOffset" : 1260,
"target" : 34962
},
{
"buffer" : 0,
"byteLength" : 576,
"byteOffset" : 1836,
"target" : 34962
},
{
"buffer" : 0,
"byteLength" : 768,
"byteOffset" : 2412,
"target" : 34962
},
{
"buffer" : 0,
"byteLength" : 384,
"byteOffset" : 3180,
"target" : 34962
},
{
"buffer" : 0,
"byteLength" : 768,
"byteOffset" : 3564,
"target" : 34962
}
],
"buffers" : [
{
"byteLength" : 4332,
"uri" : "VertexColorTest.bin"
}
],
"images" : [
{
"uri" : "VertexColorTestLabels.png"
},
{
"uri" : "VertexColorChecks.png"
}
],
"materials" : [
{
"doubleSided" : true,
"name" : "Label_Mat",
"pbrMetallicRoughness" : {
"baseColorTexture" : {
"index" : 0
},
"metallicFactor" : 0.0,
"roughnessFactor" : 0.8999999761581421
}
},
{
"name" : "VC_Checks_Mat",
"pbrMetallicRoughness" : {
"baseColorTexture" : {
"index" : 1
},
"metallicFactor" : 0.0,
"roughnessFactor" : 0.8999999761581421
}
}
],
"meshes" : [
{
"name" : "LabelMesh",
"primitives" : [
{
"attributes" : {
"NORMAL" : 2,
"POSITION" : 1,
"TANGENT" : 3,
"TEXCOORD_0" : 4
},
"indices" : 0,
"material" : 0
}
]
},
{
"name" : "VertexColorTestMesh",
"primitives" : [
{
"attributes" : {
"COLOR_0" : 10,
"NORMAL" : 7,
"POSITION" : 6,
"TANGENT" : 8,
"TEXCOORD_0" : 9
},
"indices" : 5,
"material" : 1
}
]
}
],
"nodes" : [
{
"mesh" : 0,
"name" : "Labels",
"rotation" : [
0.7071068286895752,
0.0,
-0.0,
0.7071068286895752
],
"translation" : [
0.0,
0.0,
0.9126079678535461
]
},
{
"mesh" : 1,
"name" : "VertexColorTest",
"scale" : [
1.0,
1.0,
0.07413393259048462
]
}
],
"samplers" : [
{}
],
"scene" : 0,
"scenes" : [
{
"name" : "Scene",
"nodes" : [
0,
1
]
}
],
"textures" : [
{
"sampler" : 0,
"source" : 0
},
{
"sampler" : 0,
"source" : 1
}
]
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

View File

@ -5,6 +5,7 @@
"source/geometry/geometry.js",
"source/geometry/coord2d.js",
"source/geometry/coord3d.js",
"source/geometry/coord4d.js",
"source/geometry/quaternion.js",
"source/geometry/box3d.js",
"source/geometry/octree.js",

View File

@ -21,6 +21,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -23,6 +23,7 @@
<script type="text/javascript" src="../source/geometry/geometry.js"></script>
<script type="text/javascript" src="../source/geometry/coord2d.js"></script>
<script type="text/javascript" src="../source/geometry/coord3d.js"></script>
<script type="text/javascript" src="../source/geometry/coord4d.js"></script>
<script type="text/javascript" src="../source/geometry/quaternion.js"></script>
<script type="text/javascript" src="../source/geometry/box3d.js"></script>
<script type="text/javascript" src="../source/geometry/octree.js"></script>

View File

@ -80,9 +80,11 @@ OV.SidebarDetailsPanel = class extends OV.SidebarPanel
this.AddProperty (table, new OV.Property (OV.PropertyType.Text, 'Type', typeString));
this.AddProperty (table, new OV.Property (OV.PropertyType.Color, 'Color', material.color));
if (material.type === OV.MaterialType.Phong) {
this.AddProperty (table, new OV.Property (OV.PropertyType.Color, 'Ambient', material.ambient));
this.AddProperty (table, new OV.Property (OV.PropertyType.Color, 'Ambient', material.ambient));
this.AddProperty (table, new OV.Property (OV.PropertyType.Color, 'Specular', material.specular));
} else if (material.type === OV.MaterialType.Physical) {
}
this.AddProperty (table, new OV.Property (OV.PropertyType.Boolean, 'Vertex Colors', material.vertexColors));
if (material.type === OV.MaterialType.Physical) {
this.AddProperty (table, new OV.Property (OV.PropertyType.Percent, 'Metalness', material.metalness));
this.AddProperty (table, new OV.Property (OV.PropertyType.Percent, 'Roughness', material.roughness));
}