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.
StackGenVis/frontend/node_modules/gl-surface3d/example/example.js

125 lines
3.0 KiB

4 years ago
"use strict"
var shell = require("gl-now")({ clearColor: [0,0,0,0] })
var camera = require("game-shell-orbit-camera")(shell)
var createSurface = require("../surface.js")
var createAxes = require("gl-axes3d")
var createSpikes = require("gl-spikes3d")
var ndarray = require("ndarray")
var fill = require("ndarray-fill")
var diric = require("dirichlet")
var glm = require("gl-matrix")
var createSelect = require("gl-select-static")
var mat4 = glm.mat4
var surface, spikes, axes, select, target = null
var size = 128
shell.on("gl-init", function() {
var gl = shell.gl
gl.enable(gl.DEPTH_TEST)
//Set up camera
camera.lookAt(
[-size, -size, 1.5*size], //Eye position
[0,0,0], //Eye target
[0, 0, 1]) //Up direction
//Create field
var field = ndarray(new Float32Array(4*(size+1)*(size+1)), [2*size+1,2*size+1])
/*
fill(field, function(x,y) {
return 0.5 * size * diric(10, 5.0*(x-size)/size) * diric(10, 5.0*(y-size)/size)
})
*/
var coords = [
ndarray(new Float32Array(4*(size+1)*(size+1)), [2*size+1,2*size+1]),
ndarray(new Float32Array(4*(size+1)*(size+1)), [2*size+1,2*size+1]),
field
]
var x = coords[0]
var y = coords[1]
var z = field
for(var i=0; i<=2*size; ++i) {
var theta = Math.PI * (i - size) / size
for(var j=0; j<=2*size; ++j) {
var phi = Math.PI * (j - size) / size
x.set(i, j, (50.0 + 20.0 * Math.cos(theta)) * Math.cos(phi))
y.set(i, j, (50.0 + 20.0 * Math.cos(theta)) * Math.sin(phi))
z.set(i, j, 20.0 * Math.sin(theta))
}
}
var contourLevels = []
for(var i=-5; i<=5; ++i) {
contourLevels.push(20*(i+0.3)/6.0)
}
surface = createSurface({
gl: gl,
field: field,
//levels: [contourLevels,contourLevels,contourLevels],
lineWidth: 3,
contourTint: 1,
coords: coords,
contourProject: [[true,false,false], [true,false,false], [true,false,false]],
vertexColor: false
//surfaceProject: [true, true, true]
//showContour: false
//showSurface: false
})
axes = createAxes(gl, {
bounds: [[-96,-96,-32],[96,96,32]],
tickSpacing: [0.125*size, 0.125*size, 0.125*size],
textSize: size / 32.0,
gridColor: [0.8,0.8,0.8],
tickPad: 8,
labelPad: 12
})
spikes = createSpikes(gl, {
bounds: axes.bounds
})
select = createSelect(gl, [shell.width, shell.height])
})
function drawPick(cameraParams) {
select.shape = [shell.width, shell.height]
select.begin(shell.mouse[0], shell.mouse[1], 30)
surface.drawPick(cameraParams)
target = surface.pick(select.end())
}
shell.on("gl-render", function() {
var cameraParams = {
view: camera.view(),
projection: mat4.perspective(
new Array(16), Math.PI/4.0, shell.width/shell.height, 0.1, 10000.0)
}
drawPick(cameraParams)
surface.axesBounds = axes.bounds
surface.draw(cameraParams)
axes.draw(cameraParams)
if(target) {
spikes.position = target.position
spikes.draw(cameraParams)
surface.highlightLevel = target.level
surface.dynamic(target.position)
} else {
surface.highlightLevel = -1
}
})