My current project involves drawing colored lines in a browser without using meshes. I am retrieving data from a MySQL database where geometry and other attributes are stored, and then converting this data into text blocks that create individual line objects to be rendered by threejs.
var geometry = new THREE.Geometry();
var material = new THREE.LineBasicMaterial({
color: 0xF2AA20,
linewidth: 5});
var line = new THREE.Line(geometry, material);
geometry.vertices.push(new THREE.Vector3(1040,-406,-760));
geometry.vertices.push(new THREE.Vector3(1040,-406,-709));
scene.add(line);
This process currently generates a self-contained html document with hard-coded data:
I am looking to make this workflow more scalable as we will eventually need to visualize approximately 170 million records. A potential solution could involve storing the object and attribute data in separate files (possibly JSON format) that can be dynamically loaded into an html template for cleaner and more efficient processing.
While I believe this task may be straightforward for some, I am struggling to find simple examples that align with my requirements. Can someone please demonstrate how to load a single line using JSON format in a browser?