diff --git a/src/mol-geo/color/index.ts b/src/mol-geo/color/index.ts
index 33119f31e57e5b75497a93f0f87b16a06a15c554..5abc3247586dad0e505016c57e749b2b37b2ae9d 100644
--- a/src/mol-geo/color/index.ts
+++ b/src/mol-geo/color/index.ts
@@ -4,10 +4,84 @@
* @author Alexander Rose <alexander.rose@weirdbyte.de>
*/
+import { ColorBrewer } from './tables'
+
export { ElementColor } from './structure/element';
-export function hexColorToArray(hexColor: number, array: Helpers.NumberArray, offset: number) {
+export function colorToRgb(hexColor: number) {
+ return { r: hexColor >> 16 & 255, g: hexColor >> 8 & 255, b: hexColor & 255 }
+}
+
+/** Copies hex color to rgb array */
+export function colorToArray(hexColor: number, array: Helpers.NumberArray, offset: number) {
+
+ array[ offset ] = (hexColor >> 16 & 255)
+ array[ offset + 1 ] = (hexColor >> 8 & 255)
+ array[ offset + 2 ] = (hexColor & 255)
+}
+
+/** Copies normalized (0 to 1) hex color to rgb array */
+export function normalizedColorToArray(hexColor: number, array: Helpers.NumberArray, offset: number) {
array[ offset ] = (hexColor >> 16 & 255) / 255
array[ offset + 1 ] = (hexColor >> 8 & 255) / 255
array[ offset + 2 ] = (hexColor & 255) / 255
-}
\ No newline at end of file
+}
+
+/** Linear interpolation between two colors */
+export function interpolate(c1: number, c2: number, t: number) {
+ const r1 = c1 >> 16 & 255
+ const g1 = c1 >> 8 & 255
+ const b1 = c1 & 255
+ const r2 = c2 >> 16 & 255
+ const g2 = c2 >> 8 & 255
+ const b2 = c2 & 255
+
+ const r = r1 + (r2 - r1) * t
+ const g = g1 + (g2 - g1) * t
+ const b = b1 + (b2 - b1) * t
+
+ return (r << 16) | (g << 8) | b
+}
+
+export type Color = number
+
+export interface ColorScale {
+ /** Returns hex color for given value */
+ color: (value: number) => Color
+ /** Copies color to rgb int8 array */
+ colorToArray: (value: number, array: Helpers.NumberArray, offset: number) => void
+ /** Copies normalized (0 to 1) hex color to rgb array */
+ normalizedColorToArray: (value: number, array: Helpers.NumberArray, offset: number) => void
+}
+
+export const DefaultColorScale = {
+ domain: [0, 1],
+ reverse: false,
+ colors: ColorBrewer.RdYlBu as Color[]
+}
+export type ColorScaleProps = Partial<typeof DefaultColorScale>
+
+export namespace ColorScale {
+ export function create(props: ColorScaleProps): ColorScale {
+ const { domain, reverse, colors } = { ...DefaultColorScale, ...props }
+ const [ min, max ] = reverse ? domain.slice().reverse() : domain
+ const count1 = colors.length - 1
+
+ function color(value: number) {
+ const t = ((value - min) / (max - min)) * count1
+ const tf = Math.floor(t)
+ const c1 = colors[tf]
+ const c2 = colors[Math.ceil(t)]
+ return interpolate(c1, c2, t - tf)
+ }
+ return {
+ color,
+ colorToArray: (value: number, array: Helpers.NumberArray, offset: number) => {
+ colorToArray(color(value), array, offset)
+ },
+ normalizedColorToArray: (value: number, array: Helpers.NumberArray, offset: number) => {
+ normalizedColorToArray(color(value), array, offset)
+ },
+ }
+ }
+}
diff --git a/src/mol-geo/color/tables.ts b/src/mol-geo/color/tables.ts
new file mode 100644
index 0000000000000000000000000000000000000000..23df5e0754e558b4e13bb8c3fa07099914730185
--- /dev/null
+++ b/src/mol-geo/color/tables.ts
@@ -0,0 +1,214 @@
+/**
+ * Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ *
+ * @author Alexander Rose <alexander.rose@weirdbyte.de>
+ */
+
+/**
+ * Brewer Color Lists
+ *
+ * Copyright (c) 2002 Cynthia Brewer, Mark Harrower, and The Pennsylvania State University.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ */
+export const ColorBrewer = {
+ // sequential
+ OrRd: [0xfff7ec, 0xfee8c8, 0xfdd49e, 0xfdbb84, 0xfc8d59, 0xef6548, 0xd7301f, 0xb30000, 0x7f0000],
+ PuBu: [0xfff7fb, 0xece7f2, 0xd0d1e6, 0xa6bddb, 0x74a9cf, 0x3690c0, 0x0570b0, 0x045a8d, 0x023858],
+ BuPu: [0xf7fcfd, 0xe0ecf4, 0xbfd3e6, 0x9ebcda, 0x8c96c6, 0x8c6bb1, 0x88419d, 0x810f7c, 0x4d004b],
+ Oranges: [0xfff5eb, 0xfee6ce, 0xfdd0a2, 0xfdae6b, 0xfd8d3c, 0xf16913, 0xd94801, 0xa63603, 0x7f2704],
+ BuGn: [0xf7fcfd, 0xe5f5f9, 0xccece6, 0x99d8c9, 0x66c2a4, 0x41ae76, 0x238b45, 0x006d2c, 0x00441b],
+ YlOrBr: [0xffffe5, 0xfff7bc, 0xfee391, 0xfec44f, 0xfe9929, 0xec7014, 0xcc4c02, 0x993404, 0x662506],
+ YlGn: [0xffffe5, 0xf7fcb9, 0xd9f0a3, 0xaddd8e, 0x78c679, 0x41ab5d, 0x238443, 0x006837, 0x004529],
+ Reds: [0xfff5f0, 0xfee0d2, 0xfcbba1, 0xfc9272, 0xfb6a4a, 0xef3b2c, 0xcb181d, 0xa50f15, 0x67000d],
+ RdPu: [0xfff7f3, 0xfde0dd, 0xfcc5c0, 0xfa9fb5, 0xf768a1, 0xdd3497, 0xae017e, 0x7a0177, 0x49006a],
+ Greens: [0xf7fcf5, 0xe5f5e0, 0xc7e9c0, 0xa1d99b, 0x74c476, 0x41ab5d, 0x238b45, 0x006d2c, 0x00441b],
+ YlGnBu: [0xffffd9, 0xedf8b1, 0xc7e9b4, 0x7fcdbb, 0x41b6c4, 0x1d91c0, 0x225ea8, 0x253494, 0x081d58],
+ Purples: [0xfcfbfd, 0xefedf5, 0xdadaeb, 0xbcbddc, 0x9e9ac8, 0x807dba, 0x6a51a3, 0x54278f, 0x3f007d],
+ GnBu: [0xf7fcf0, 0xe0f3db, 0xccebc5, 0xa8ddb5, 0x7bccc4, 0x4eb3d3, 0x2b8cbe, 0x0868ac, 0x084081],
+ Greys: [0xffffff, 0xf0f0f0, 0xd9d9d9, 0xbdbdbd, 0x969696, 0x737373, 0x525252, 0x252525, 0x000000],
+ YlOrRd: [0xffffcc, 0xffeda0, 0xfed976, 0xfeb24c, 0xfd8d3c, 0xfc4e2a, 0xe31a1c, 0xbd0026, 0x800026],
+ PuRd: [0xf7f4f9, 0xe7e1ef, 0xd4b9da, 0xc994c7, 0xdf65b0, 0xe7298a, 0xce1256, 0x980043, 0x67001f],
+ Blues: [0xf7fbff, 0xdeebf7, 0xc6dbef, 0x9ecae1, 0x6baed6, 0x4292c6, 0x2171b5, 0x08519c, 0x08306b],
+ PuBuGn: [0xfff7fb, 0xece2f0, 0xd0d1e6, 0xa6bddb, 0x67a9cf, 0x3690c0, 0x02818a, 0x016c59, 0x014636],
+ Viridis: [0x440154, 0x482777, 0x3f4a8a, 0x31678e, 0x26838f, 0x1f9d8a, 0x6cce5a, 0xb6de2b, 0xfee825],
+
+ // diverging
+ Spectral: [0x9e0142, 0xd53e4f, 0xf46d43, 0xfdae61, 0xfee08b, 0xffffbf, 0xe6f598, 0xabdda4, 0x66c2a5, 0x3288bd, 0x5e4fa2],
+ RdYlGn: [0xa50026, 0xd73027, 0xf46d43, 0xfdae61, 0xfee08b, 0xffffbf, 0xd9ef8b, 0xa6d96a, 0x66bd63, 0x1a9850, 0x006837],
+ RdBu: [0x67001f, 0xb2182b, 0xd6604d, 0xf4a582, 0xfddbc7, 0xf7f7f7, 0xd1e5f0, 0x92c5de, 0x4393c3, 0x2166ac, 0x053061],
+ PiYG: [0x8e0152, 0xc51b7d, 0xde77ae, 0xf1b6da, 0xfde0ef, 0xf7f7f7, 0xe6f5d0, 0xb8e186, 0x7fbc41, 0x4d9221, 0x276419],
+ PRGn: [0x40004b, 0x762a83, 0x9970ab, 0xc2a5cf, 0xe7d4e8, 0xf7f7f7, 0xd9f0d3, 0xa6dba0, 0x5aae61, 0x1b7837, 0x00441b],
+ RdYlBu: [0xa50026, 0xd73027, 0xf46d43, 0xfdae61, 0xfee090, 0xffffbf, 0xe0f3f8, 0xabd9e9, 0x74add1, 0x4575b4, 0x313695],
+ BrBG: [0x543005, 0x8c510a, 0xbf812d, 0xdfc27d, 0xf6e8c3, 0xf5f5f5, 0xc7eae5, 0x80cdc1, 0x35978f, 0x01665e, 0x003c30],
+ RdGy: [0x67001f, 0xb2182b, 0xd6604d, 0xf4a582, 0xfddbc7, 0xffffff, 0xe0e0e0, 0xbababa, 0x878787, 0x4d4d4d, 0x1a1a1a],
+ PuOr: [0x7f3b08, 0xb35806, 0xe08214, 0xfdb863, 0xfee0b6, 0xf7f7f7, 0xd8daeb, 0xb2abd2, 0x8073ac, 0x542788, 0x2d004b],
+
+ // qualitative
+ Set2: [0x66c2a5, 0xfc8d62, 0x8da0cb, 0xe78ac3, 0xa6d854, 0xffd92f, 0xe5c494, 0xb3b3b3],
+ Accent: [0x7fc97f, 0xbeaed4, 0xfdc086, 0xffff99, 0x386cb0, 0xf0027f, 0xbf5b17, 0x666666],
+ Set1: [0xe41a1c, 0x377eb8, 0x4daf4a, 0x984ea3, 0xff7f00, 0xffff33, 0xa65628, 0xf781bf, 0x999999],
+ Set3: [0x8dd3c7, 0xffffb3, 0xbebada, 0xfb8072, 0x80b1d3, 0xfdb462, 0xb3de69, 0xfccde5, 0xd9d9d9, 0xbc80bd, 0xccebc5, 0xffed6f],
+ Dark2: [0x1b9e77, 0xd95f02, 0x7570b3, 0xe7298a, 0x66a61e, 0xe6ab02, 0xa6761d, 0x666666],
+ Paired: [0xa6cee3, 0x1f78b4, 0xb2df8a, 0x33a02c, 0xfb9a99, 0xe31a1c, 0xfdbf6f, 0xff7f00, 0xcab2d6, 0x6a3d9a, 0xffff99, 0xb15928],
+ Pastel2: [0xb3e2cd, 0xfdcdac, 0xcbd5e8, 0xf4cae4, 0xe6f5c9, 0xfff2ae, 0xf1e2cc, 0xcccccc],
+ Pastel1: [0xfbb4ae, 0xb3cde3, 0xccebc5, 0xdecbe4, 0xfed9a6, 0xffffcc, 0xe5d8bd, 0xfddaec, 0xf2f2f2]
+}
+
+/** X11 color names http://www.w3.org/TR/css3-color/#svg-color */
+export const ColorNames = {
+ aliceblue: 0xf0f8ff,
+ antiquewhite: 0xfaebd7,
+ aqua: 0x00ffff,
+ aquamarine: 0x7fffd4,
+ azure: 0xf0ffff,
+ beige: 0xf5f5dc,
+ bisque: 0xffe4c4,
+ black: 0x000000,
+ blanchedalmond: 0xffebcd,
+ blue: 0x0000ff,
+ blueviolet: 0x8a2be2,
+ brown: 0xa52a2a,
+ burlywood: 0xdeb887,
+ cadetblue: 0x5f9ea0,
+ chartreuse: 0x7fff00,
+ chocolate: 0xd2691e,
+ coral: 0xff7f50,
+ cornflower: 0x6495ed,
+ cornflowerblue: 0x6495ed,
+ cornsilk: 0xfff8dc,
+ crimson: 0xdc143c,
+ cyan: 0x00ffff,
+ darkblue: 0x00008b,
+ darkcyan: 0x008b8b,
+ darkgoldenrod: 0xb8860b,
+ darkgray: 0xa9a9a9,
+ darkgreen: 0x006400,
+ darkgrey: 0xa9a9a9,
+ darkkhaki: 0xbdb76b,
+ darkmagenta: 0x8b008b,
+ darkolivegreen: 0x556b2f,
+ darkorange: 0xff8c00,
+ darkorchid: 0x9932cc,
+ darkred: 0x8b0000,
+ darksalmon: 0xe9967a,
+ darkseagreen: 0x8fbc8f,
+ darkslateblue: 0x483d8b,
+ darkslategray: 0x2f4f4f,
+ darkslategrey: 0x2f4f4f,
+ darkturquoise: 0x00ced1,
+ darkviolet: 0x9400d3,
+ deeppink: 0xff1493,
+ deepskyblue: 0x00bfff,
+ dimgray: 0x696969,
+ dimgrey: 0x696969,
+ dodgerblue: 0x1e90ff,
+ firebrick: 0xb22222,
+ floralwhite: 0xfffaf0,
+ forestgreen: 0x228b22,
+ fuchsia: 0xff00ff,
+ gainsboro: 0xdcdcdc,
+ ghostwhite: 0xf8f8ff,
+ gold: 0xffd700,
+ goldenrod: 0xdaa520,
+ gray: 0x808080,
+ green: 0x008000,
+ greenyellow: 0xadff2f,
+ grey: 0x808080,
+ honeydew: 0xf0fff0,
+ hotpink: 0xff69b4,
+ indianred: 0xcd5c5c,
+ indigo: 0x4b0082,
+ ivory: 0xfffff0,
+ khaki: 0xf0e68c,
+ laserlemon: 0xffff54,
+ lavender: 0xe6e6fa,
+ lavenderblush: 0xfff0f5,
+ lawngreen: 0x7cfc00,
+ lemonchiffon: 0xfffacd,
+ lightblue: 0xadd8e6,
+ lightcoral: 0xf08080,
+ lightcyan: 0xe0ffff,
+ lightgoldenrod: 0xfafad2,
+ lightgoldenrodyellow: 0xfafad2,
+ lightgray: 0xd3d3d3,
+ lightgreen: 0x90ee90,
+ lightgrey: 0xd3d3d3,
+ lightpink: 0xffb6c1,
+ lightsalmon: 0xffa07a,
+ lightseagreen: 0x20b2aa,
+ lightskyblue: 0x87cefa,
+ lightslategray: 0x778899,
+ lightslategrey: 0x778899,
+ lightsteelblue: 0xb0c4de,
+ lightyellow: 0xffffe0,
+ lime: 0x00ff00,
+ limegreen: 0x32cd32,
+ linen: 0xfaf0e6,
+ magenta: 0xff00ff,
+ maroon: 0x800000,
+ maroon2: 0x7f0000,
+ maroon3: 0xb03060,
+ mediumaquamarine: 0x66cdaa,
+ mediumblue: 0x0000cd,
+ mediumorchid: 0xba55d3,
+ mediumpurple: 0x9370db,
+ mediumseagreen: 0x3cb371,
+ mediumslateblue: 0x7b68ee,
+ mediumspringgreen: 0x00fa9a,
+ mediumturquoise: 0x48d1cc,
+ mediumvioletred: 0xc71585,
+ midnightblue: 0x191970,
+ mintcream: 0xf5fffa,
+ mistyrose: 0xffe4e1,
+ moccasin: 0xffe4b5,
+ navajowhite: 0xffdead,
+ navy: 0x000080,
+ oldlace: 0xfdf5e6,
+ olive: 0x808000,
+ olivedrab: 0x6b8e23,
+ orange: 0xffa500,
+ orangered: 0xff4500,
+ orchid: 0xda70d6,
+ palegoldenrod: 0xeee8aa,
+ palegreen: 0x98fb98,
+ paleturquoise: 0xafeeee,
+ palevioletred: 0xdb7093,
+ papayawhip: 0xffefd5,
+ peachpuff: 0xffdab9,
+ peru: 0xcd853f,
+ pink: 0xffc0cb,
+ plum: 0xdda0dd,
+ powderblue: 0xb0e0e6,
+ purple: 0x800080,
+ purple2: 0x7f007f,
+ purple3: 0xa020f0,
+ rebeccapurple: 0x663399,
+ red: 0xff0000,
+ rosybrown: 0xbc8f8f,
+ royalblue: 0x4169e1,
+ saddlebrown: 0x8b4513,
+ salmon: 0xfa8072,
+ sandybrown: 0xf4a460,
+ seagreen: 0x2e8b57,
+ seashell: 0xfff5ee,
+ sienna: 0xa0522d,
+ silver: 0xc0c0c0,
+ skyblue: 0x87ceeb,
+ slateblue: 0x6a5acd,
+ slategray: 0x708090,
+ slategrey: 0x708090,
+ snow: 0xfffafa,
+ springgreen: 0x00ff7f,
+ steelblue: 0x4682b4,
+ tan: 0xd2b48c,
+ teal: 0x008080,
+ thistle: 0xd8bfd8,
+ tomato: 0xff6347,
+ turquoise: 0x40e0d0,
+ violet: 0xee82ee,
+ wheat: 0xf5deb3,
+ white: 0xffffff,
+ whitesmoke: 0xf5f5f5,
+ yellow: 0xffff00,
+ yellowgreen: 0x9acd32
+}
\ No newline at end of file
diff --git a/src/mol-geo/representation/structure/spacefill.ts b/src/mol-geo/representation/structure/spacefill.ts
index 4a0c9ab142300f4f26bc78cf45c4b805374336bd..bf3cb8f3511f65a6e690e8254bc6e39d74bae5b5 100644
--- a/src/mol-geo/representation/structure/spacefill.ts
+++ b/src/mol-geo/representation/structure/spacefill.ts
@@ -15,7 +15,7 @@ import { RepresentationProps, UnitsRepresentation } from './index';
import { Task } from 'mol-task'
import { MeshBuilder } from '../../shape/mesh-builder';
import { VdwRadius } from 'mol-model/structure/model/properties/atomic';
-import { ElementColor, hexColorToArray } from '../../color';
+import { ElementColor, colorToArray, normalizedColorToArray, ColorScale, colorToRgb } from '../../color';
import { ChunkedArray } from 'mol-data/util';
import { Color } from 'mol-gl/renderable/mesh';
import { createColorTexture } from 'mol-gl/util';
@@ -69,6 +69,7 @@ export default function Spacefill(): UnitsRepresentation<SpacefillProps> {
const mesh = meshBuilder.getMesh()
console.log(mesh)
+ if (!mesh.offsetBuffer.ref.value) return
const unitsCount = units.length
const transformArray = new Float32Array(unitsCount * 16)
@@ -78,40 +79,56 @@ export default function Spacefill(): UnitsRepresentation<SpacefillProps> {
console.log({ unitsCount, elementCount })
- let colorType = 'instance'
+ let colorType = 'element'
let color: Color
if (colorType === 'attribute') {
const colors = new Float32Array(mesh.vertexCount * 3);
- if (mesh.offsetBuffer.ref.value) {
- const offsets = mesh.offsetBuffer.ref.value
- for (let i = 0, il = mesh.offsetCount - 1; i < il; ++i) {
- const start = offsets[i]
- const end = offsets[i + 1]
- const e = OrderedSet.getAt(elementGroup.elements, i)
- const hexColor = ElementColor(type_symbol.value(e))
- for (let i = start, il = end; i < il; ++i) {
- hexColorToArray(hexColor, colors, i * 3)
- }
+ const offsets = mesh.offsetBuffer.ref.value
+ for (let i = 0, il = mesh.offsetCount - 1; i < il; ++i) {
+ const start = offsets[i]
+ const end = offsets[i + 1]
+ const e = OrderedSet.getAt(elementGroup.elements, i)
+ const hexColor = ElementColor(type_symbol.value(e))
+ for (let i = start, il = end; i < il; ++i) {
+ normalizedColorToArray(hexColor, colors, i * 3)
}
- color = { type: 'attribute', value: ValueCell.create(colors) }
}
+ color = { type: 'attribute', value: ValueCell.create(colors) }
} else if (colorType === 'instance') {
const colors = createColorTexture(unitsCount)
- colors.set([ 0, 0, 255 ])
-
+ const scale = ColorScale.create({ domain: [ 0, unitsCount - 1 ] })
+ for (let i = 0; i < unitsCount; i++) {
+ scale.colorToArray(i, colors, i * 3)
+ }
color = { type: 'instance', value: ValueCell.create(colors) }
+ } else if (colorType === 'element') {
+ const elementCount = mesh.offsetCount - 1
+ const count = unitsCount * elementCount
+ const colors = createColorTexture(count)
+ const scale = ColorScale.create({ domain: [ 0, count - 1 ] })
+ let colorOffset = 0
+ for (let i = 0; i < unitsCount; i++) {
+ for (let j = 0, jl = elementCount; j < jl; ++j) {
+ const hexColor = scale.color(i * elementCount + j)
+ colorToArray(hexColor, colors, colorOffset)
+ colorOffset += 3
+ }
+ }
+ color = { type: 'element', value: ValueCell.create(colors) }
}
const spheres = createRenderObject('mesh', {
position: mesh.vertexBuffer,
normal: mesh.normalBuffer,
color: color!,
+ id: mesh.idBuffer,
transform: ValueCell.create(transformArray),
- elements: mesh.indexBuffer,
+ index: mesh.indexBuffer,
instanceCount: unitsCount,
- elementCount: mesh.triangleCount,
+ indexCount: mesh.triangleCount,
+ elementCount: mesh.offsetCount - 1,
positionCount: mesh.vertexCount
}, {})
renderObjects.push(spheres)
diff --git a/src/mol-geo/shape/mesh-builder.ts b/src/mol-geo/shape/mesh-builder.ts
index 6326ce22f6244f1b035a5e8de610975e1af70b96..6122d7aea49145d973f56e32c8455d5665efe5d2 100644
--- a/src/mol-geo/shape/mesh-builder.ts
+++ b/src/mol-geo/shape/mesh-builder.ts
@@ -32,7 +32,7 @@ export namespace MeshBuilder {
const normals = ChunkedArray.create(Float32Array, 3, chunkSize, initialCount);
const indices = ChunkedArray.create(Uint32Array, 3, chunkSize * 3, initialCount * 3);
- const ids = ChunkedArray.create(Uint32Array, 1, chunkSize, initialCount);
+ const ids = ChunkedArray.create(Float32Array, 1, chunkSize, initialCount);
const offsets = ChunkedArray.create(Uint32Array, 1, chunkSize, initialCount);
let currentId = -1
@@ -86,7 +86,7 @@ export namespace MeshBuilder {
vertexBuffer: ValueCell.create(ChunkedArray.compact(vertices, true) as Float32Array),
indexBuffer: ValueCell.create(ChunkedArray.compact(indices, true) as Uint32Array),
normalBuffer: ValueCell.create(ChunkedArray.compact(normals, true) as Float32Array),
- idBuffer: ValueCell.create(ChunkedArray.compact(ids, true) as Uint32Array),
+ idBuffer: ValueCell.create(ChunkedArray.compact(ids, true) as Float32Array),
offsetBuffer: ValueCell.create(ChunkedArray.compact(offsets, true) as Uint32Array),
normalsComputed: true,
}
diff --git a/src/mol-geo/shape/mesh.ts b/src/mol-geo/shape/mesh.ts
index 47671edb3229b10737afff0847045b201f6b8946..fce47eec05ff4ccd62b43378190e7771e2b00330 100644
--- a/src/mol-geo/shape/mesh.ts
+++ b/src/mol-geo/shape/mesh.ts
@@ -14,10 +14,11 @@ export interface Mesh {
vertexCount: number,
triangleCount: number,
offsetCount: number,
+
vertexBuffer: ValueCell<Float32Array>,
indexBuffer: ValueCell<Uint32Array>,
normalBuffer: ValueCell<Float32Array | undefined>,
- idBuffer: ValueCell<Uint32Array | undefined>,
+ idBuffer: ValueCell<Float32Array | undefined>,
offsetBuffer: ValueCell<Uint32Array | undefined>,
normalsComputed: boolean,
diff --git a/src/mol-gl/renderable/mesh.ts b/src/mol-gl/renderable/mesh.ts
index b9f62d6d16b165731ce38bb1808c2080bf383bac..630a470c854933646959c815608de8b33f6dd35f 100644
--- a/src/mol-gl/renderable/mesh.ts
+++ b/src/mol-gl/renderable/mesh.ts
@@ -26,10 +26,13 @@ namespace Mesh {
export type Data = {
position: ValueCell<Float32Array>
normal: ValueCell<Float32Array>
+ id: ValueCell<Float32Array>
+
readonly color: Color
transform: ValueCell<Float32Array>
- elements: ValueCell<Uint32Array>
+ index: ValueCell<Uint32Array>
+ indexCount: number
instanceCount: number
elementCount: number
positionCount: number
@@ -40,6 +43,7 @@ namespace Mesh {
const uniforms = {
objectId: _uniforms.objectId || 0,
instanceCount: data.instanceCount,
+ elementCount: data.elementCount,
..._uniforms
}
if (data.color.type === 'instance' || data.color.type === 'element') {
@@ -49,6 +53,8 @@ namespace Mesh {
instanceId: Attribute.create(regl, instanceId, data.instanceCount, { size: 1, divisor: 1 }),
position: Attribute.create(regl, data.position, data.positionCount, { size: 3 }),
normal: Attribute.create(regl, data.normal, data.positionCount, { size: 3 }),
+
+ elementId: Attribute.create(regl, data.id, data.positionCount, { size: 1 }),
...createTransformAttributes(regl, data.transform, data.instanceCount)
})
if (data.color.type === 'attribute') {
@@ -59,11 +65,10 @@ namespace Mesh {
uniforms,
attributes,
elements: regl.elements({
- data: data.elements.ref.value,
+ data: data.index.ref.value,
primitive: 'triangles',
type: 'uint32',
- count: data.elementCount * 3,
- // length: count * 3 * 2
+ count: data.indexCount * 3
}),
instances: data.instanceCount,
})
diff --git a/src/mol-gl/shader/mesh.frag b/src/mol-gl/shader/mesh.frag
index 0f4475b80802b9988ec0cdeb22f525113306b220..ee4ad0fabebaabd36d818a209debf1cfaef61666 100644
--- a/src/mol-gl/shader/mesh.frag
+++ b/src/mol-gl/shader/mesh.frag
@@ -5,7 +5,8 @@
*/
// #define ATTRIBUTE_COLOR
-#define INSTANCE_COLOR
+// #define INSTANCE_COLOR
+#define ELEMENT_COLOR
precision highp float;
@@ -54,7 +55,7 @@ float orenNayarDiffuse(vec3 lightDirection, vec3 viewDirection, vec3 surfaceNorm
#pragma glslify: attenuation = require(./attenuation.glsl)
const float specularScale = 0.65;
-const float shininess = 30.0;
+const float shininess = 100.0;
const float roughness = 5.0;
const float albedo = 0.95;
diff --git a/src/mol-gl/shader/mesh.vert b/src/mol-gl/shader/mesh.vert
index 1ea5b9ac044c86d002ce06fed2504313ebd63103..8f8b904babb84bd51c7404c582377a785724e5e9 100644
--- a/src/mol-gl/shader/mesh.vert
+++ b/src/mol-gl/shader/mesh.vert
@@ -5,7 +5,8 @@
*/
// #define ATTRIBUTE_COLOR
-#define INSTANCE_COLOR
+// #define INSTANCE_COLOR
+#define ELEMENT_COLOR
precision highp float;
@@ -13,6 +14,7 @@ uniform mat4 projection, model, view;
uniform int objectId;
uniform int instanceCount;
+uniform int elementCount;
#if defined( UNIFORM_COLOR )
uniform vec3 color;
@@ -27,7 +29,7 @@ attribute vec3 position;
attribute vec3 normal;
attribute vec4 transformColumn0, transformColumn1, transformColumn2, transformColumn3;
attribute float instanceId;
-// attribute int elementId;
+attribute float elementId;
varying vec3 vColor;
varying vec3 vNormal;
@@ -42,8 +44,9 @@ void main(){
vColor = color;
#elif defined( INSTANCE_COLOR )
vColor = read_vec3(colorTex, instanceId, colorTexSize);
- // #elif defined( ELEMENT_COLOR )
- // vColor = read_vec3(colorTex, instanceId * instanceCount + elementId, colorTexSize);
+ #elif defined( ELEMENT_COLOR )
+ // vColor = read_vec3(colorTex, elementId, colorTexSize);
+ vColor = read_vec3(colorTex, instanceId * float(elementCount) + elementId, colorTexSize);
#endif
mat4 transform = mat4(transformColumn0, transformColumn1, transformColumn2, transformColumn3);