Js-visg-m-s | Manual

scene.use(new LoggingModule()); This module accepts JSON streams over WebSocket:

| Property | Type | Default | Description | |----------|------|---------|-------------| | renderer | string | 'webgl' | 'webgl' , 'webgpu' , 'canvas2d' | | antialias | boolean | true | Enable MSAA | | pixelRatio | number | window.devicePixelRatio | For retina displays | | fpsLimit | number | 60 | Throttle render frames | | modules | array | [] | List of module names to load | | shaders | object | {} | Custom vertex/fragment shaders | const config = renderer: 'webgpu', antialias: false, fpsLimit: 30, modules: ['TooltipModule', 'DataStreamModule'], shaders: vertex: 'custom.vert', fragment: 'custom.frag' ; const app = new JSVisgMS.Application(config); Chapter 5: Working with Modules Modules are the "M" in JS-VISG-M-S and dramatically extend functionality. 5.1 Loading a Module import TimelineModule from 'js-visg-m-s/modules/timeline'; scene.registerModule(TimelineModule, position: 'bottom' ); 5.2 Creating Your Own Module class LoggingModule extends JSVisgMS.BaseModule onRender(glContext) console.log('Frame rendered at', performance.now()); Add scene

mesh.geometry.dispose(); mesh.texture.dispose(); scene.removeNode(mesh); 8.1 Real-time Stock Chart const lineSeries = scene.addLineSeries( data: stockPrices, xAxis: 'time', yAxis: 'price', animation: true ); setInterval(() => lineSeries.push( time: Date.now(), price: getNewPrice() ); , 1000); 8.2 3D Network Graph const graphModule = scene.getModule('GraphModule'); graphModule.addNode('server1', position: [0,0,0], color: 'red' ); graphModule.addNode('server2', position: [2,0,1], color: 'blue' ); graphModule.addEdge('server1', 'server2', thickness: 0.1 ); 8.3 Scientific Surface Plot const surface = scene.addSurfacePlot( function: (x, z) => Math.sin(x) * Math.cos(z), range: x: [-3, 3], z: [-3, 3] , resolution: 50, colormap: 'viridis' ); Chapter 9: Troubleshooting & FAQ Q1: "Canvas is blank but no errors" Solution: Ensure your camera is positioned correctly. Default camera looks at origin from (5,5,5). Add scene.camera.lookAt(0,0,0) and scene.camera.updateProjectionMatrix() . Q2: WebGL context loss Solution: Register a context loss handler: shaders: vertex: 'custom.vert'