StackGenVis: Alignment of Data, Algorithms, and Models for Stacking Ensemble Learning Using Performance Metrics
https://doi.org/10.1109/TVCG.2020.3030352
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
194 lines
4.0 KiB
194 lines
4.0 KiB
'use strict'
|
|
|
|
var createBuffer = require('gl-buffer')
|
|
var createVAO = require('gl-vao')
|
|
var createShader = require('./shaders/index')
|
|
|
|
module.exports = createSpikes
|
|
|
|
var identity = [1,0,0,0,
|
|
0,1,0,0,
|
|
0,0,1,0,
|
|
0,0,0,1]
|
|
|
|
function AxisSpikes(gl, buffer, vao, shader) {
|
|
this.gl = gl
|
|
this.buffer = buffer
|
|
this.vao = vao
|
|
this.shader = shader
|
|
this.pixelRatio = 1
|
|
this.bounds = [[-1000,-1000,-1000], [1000,1000,1000]]
|
|
this.position = [0,0,0]
|
|
this.lineWidth = [2,2,2]
|
|
this.colors = [[0,0,0,1], [0,0,0,1], [0,0,0,1]]
|
|
this.enabled = [true,true,true]
|
|
this.drawSides = [true,true,true]
|
|
this.axes = null
|
|
}
|
|
|
|
var proto = AxisSpikes.prototype
|
|
|
|
var OUTER_FACE = [0,0,0]
|
|
var INNER_FACE = [0,0,0]
|
|
|
|
var SHAPE = [0,0]
|
|
|
|
proto.isTransparent = function() {
|
|
return false
|
|
}
|
|
|
|
proto.drawTransparent = function(camera) {}
|
|
|
|
proto.draw = function(camera) {
|
|
var gl = this.gl
|
|
var vao = this.vao
|
|
var shader = this.shader
|
|
|
|
vao.bind()
|
|
shader.bind()
|
|
|
|
var model = camera.model || identity
|
|
var view = camera.view || identity
|
|
var projection = camera.projection || identity
|
|
|
|
var axis
|
|
if(this.axes) {
|
|
axis = this.axes.lastCubeProps.axis
|
|
}
|
|
|
|
var outerFace = OUTER_FACE
|
|
var innerFace = INNER_FACE
|
|
for(var i=0; i<3; ++i) {
|
|
if(axis && axis[i] < 0) {
|
|
outerFace[i] = this.bounds[0][i]
|
|
innerFace[i] = this.bounds[1][i]
|
|
} else {
|
|
outerFace[i] = this.bounds[1][i]
|
|
innerFace[i] = this.bounds[0][i]
|
|
}
|
|
}
|
|
|
|
SHAPE[0] = gl.drawingBufferWidth
|
|
SHAPE[1] = gl.drawingBufferHeight
|
|
|
|
shader.uniforms.model = model
|
|
shader.uniforms.view = view
|
|
shader.uniforms.projection = projection
|
|
shader.uniforms.coordinates = [this.position, outerFace, innerFace]
|
|
shader.uniforms.colors = this.colors
|
|
shader.uniforms.screenShape = SHAPE
|
|
|
|
for(var i=0; i<3; ++i) {
|
|
shader.uniforms.lineWidth = this.lineWidth[i] * this.pixelRatio
|
|
if(this.enabled[i]) {
|
|
vao.draw(gl.TRIANGLES, 6, 6*i)
|
|
if(this.drawSides[i]) {
|
|
vao.draw(gl.TRIANGLES, 12, 18+12*i)
|
|
}
|
|
}
|
|
}
|
|
|
|
vao.unbind()
|
|
}
|
|
|
|
proto.update = function(options) {
|
|
if(!options) {
|
|
return
|
|
}
|
|
if("bounds" in options) {
|
|
this.bounds = options.bounds
|
|
}
|
|
if("position" in options) {
|
|
this.position = options.position
|
|
}
|
|
if("lineWidth" in options) {
|
|
this.lineWidth = options.lineWidth
|
|
}
|
|
if("colors" in options) {
|
|
this.colors = options.colors
|
|
}
|
|
if("enabled" in options) {
|
|
this.enabled = options.enabled
|
|
}
|
|
if("drawSides" in options) {
|
|
this.drawSides = options.drawSides
|
|
}
|
|
}
|
|
|
|
proto.dispose = function() {
|
|
this.vao.dispose()
|
|
this.buffer.dispose()
|
|
this.shader.dispose()
|
|
}
|
|
|
|
|
|
|
|
function createSpikes(gl, options) {
|
|
//Create buffers
|
|
var data = [ ]
|
|
|
|
function line(x,y,z,i,l,h) {
|
|
var row = [x,y,z, 0,0,0, 1]
|
|
row[i+3] = 1
|
|
row[i] = l
|
|
data.push.apply(data, row)
|
|
row[6] = -1
|
|
data.push.apply(data, row)
|
|
row[i] = h
|
|
data.push.apply(data, row)
|
|
data.push.apply(data, row)
|
|
row[6] = 1
|
|
data.push.apply(data, row)
|
|
row[i] = l
|
|
data.push.apply(data, row)
|
|
}
|
|
|
|
line(0,0,0, 0, 0, 1)
|
|
line(0,0,0, 1, 0, 1)
|
|
line(0,0,0, 2, 0, 1)
|
|
|
|
line(1,0,0, 1, -1,1)
|
|
line(1,0,0, 2, -1,1)
|
|
|
|
line(0,1,0, 0, -1,1)
|
|
line(0,1,0, 2, -1,1)
|
|
|
|
line(0,0,1, 0, -1,1)
|
|
line(0,0,1, 1, -1,1)
|
|
|
|
var buffer = createBuffer(gl, data)
|
|
var vao = createVAO(gl, [{
|
|
type: gl.FLOAT,
|
|
buffer: buffer,
|
|
size: 3,
|
|
offset: 0,
|
|
stride: 28
|
|
}, {
|
|
type: gl.FLOAT,
|
|
buffer: buffer,
|
|
size: 3,
|
|
offset: 12,
|
|
stride: 28
|
|
}, {
|
|
type: gl.FLOAT,
|
|
buffer: buffer,
|
|
size: 1,
|
|
offset: 24,
|
|
stride: 28
|
|
}])
|
|
|
|
//Create shader
|
|
var shader = createShader(gl)
|
|
shader.attributes.position.location = 0
|
|
shader.attributes.color.location = 1
|
|
shader.attributes.weight.location = 2
|
|
|
|
//Create spike object
|
|
var spikes = new AxisSpikes(gl, buffer, vao, shader)
|
|
|
|
//Set parameters
|
|
spikes.update(options)
|
|
|
|
//Return resulting object
|
|
return spikes
|
|
}
|
|
|