{
// global variables
let _model = {
// saved nurbs curves
curves: [],
// new nurbs curve
points: null,
// viewport for canvas
viewport: null,
}
var rhino, doc
/*
rhino3dm().then(async m => {
console.log('Loaded rhino3dm.')
rhino = m // global
//run()
})
*/
rhino3dm().then(function(m) {
rhino = m; // global
//console.log(m)
run();//have to call rhino functions after the asynchrnous call
//create()
});
//function run(){}
function run() {
const zero_tolerance = 2.3283064365387E-10;
// Define a circle
const circle = new rhino.Circle(1.0);
console.log(rhino.Circle)
}
//console.log('hello')
while (true) {
renderer.render(scene, camera);
// box.position.y += 0.01;
// controls.update();
requestAnimationFrame(function(){renderer.render(scene, camera)});
yield renderer.domElement;
}
console.log("hello2")
}
pts = {
let rhino, doc
rhino3dm().then(async m => {
console.log('Loaded rhino3dm.')
rhino = m // global
//init()
create()
})
function create () {
console.log(rhino)
//doc = new rhino.File3dm()
const loader = new THREE.BufferGeometryLoader();
// -- POINTS / POINTCLOUDS -- //
// POINTS
let ptA = [0, 0, 0]
const geometry = new THREE.BufferGeometry()
const vertices = new Float32Array( ptA )
geometry.setAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) )
const pointsMaterial = new THREE.PointsMaterial( { color: 0xff0000 } )
const threejsPoint = new THREE.Points( geometry, pointsMaterial )
//scene.add(threejsPoint)
//doc.objects().addPoint(ptA)
/*
//const pointsMaterial = new THREE.PointsMaterial( { color: 0xff0000 } )
// POINTCLOUD
//const ptA = [10, 10, 10]
const ptB = [10, 0, 0]
const ptC = [10, 10, 0]
const ptD = [0, 10, 0]
const ptE = [ 20, 20, 20]
const ptF = [30, 0, 0]
const ptG = [35, 5, 0]
const ptH = [40, -5, 0]
const ptI = [45, 5, 0]
const ptJ = [50, 0, 0]
const red = { r: 255, g: 0, b: 0, a: 0 }
const pointCloud = new rhino.PointCloud()
pointCloud.add( ptA, red )
pointCloud.add( ptB, red )
pointCloud.add( ptC, red )
pointCloud.add( ptD, red )
pointCloud.add( ptE, red )
pointCloud.add( ptF, red )
pointCloud.add( ptG, red )
pointCloud.add( ptH, red )
pointCloud.add( ptI, red )
pointCloud.add( ptJ, red )
const threejsPointsGeometry = loader.parse ( pointCloud.toThreejsJSON() )
//const threejsPointsGeometry = loader.parse ( pointCloud.toJSON() )
//const threejsPoints = new THREE.Points( threejsPointsGeometry, pointsMaterial )
//scene.add( threejsPoints )
//doc.objects().add(pointCloud, null)
*/
}
}
plane = getBox(3, 0.1, 10, [0,-1,0])
camera = {
var camera = new THREE.PerspectiveCamera(40, width/height,
1,
1000
);
camera.position.x = 10;
camera.position.y = 5;
camera.position.z = 10;
camera.lookAt(new THREE.Vector3(0, 0, 0));
// camera.lookAt(box);
return camera;
}
height = 600
THREE1={importjs("https://unpkg.com/three@0.144.0/build/three.module.js","window.THREE")}
import { Rhino3dmLoader } from 'https://cdn.jsdelivr.net/npm/three@0.126.0/examples/jsm/loaders/3DMLoader.js'
//import { rhino3dm } from 'https://cdn.jsdelivr.net/npm/rhino3dm@0.15.0-beta/rhino3dm.module.js'
importjs = function(src,targetvar) {
/*if (!$("head").find(`script[src="${src}"]`)) {
$("head").append(`<script src="${src}"></script>`);
}*/
return new Promise(function(resolve,reject) {
function waitForFoo(){
if (typeof targetvar == "undefined") resolve();
if (eval(targetvar)) resolve(eval(targetvar));
setTimeout(waitForFoo, 30);
};
require(src).then(function(){
waitForFoo();
}).catch(function() {
waitForFoo();
});
});
}
rhino3dm = importjs("https://files.mcneel.com/rhino3dm/js/latest/rhino3dm.js","window.rhino3dm")
//rhino3dm1 = importjs("https://cdn.jsdelivr.net/npm/rhino3dm@7.15.0/rhino3dm.module.js","window.rhino3dm4")
RhinoCompute = importjs("https://files.mcneel.com/rhino3dm/js/latest/compute.rhino3d.js","window.RhinoCompute")
"https://unpkg.com/highcharts@6.1.1/highcharts.js"
function update(renderer, scene, camera, controls) {
renderer.render(scene, camera);
controls.update();
return renderer.domElement;
requestAnimationFrame(function() {
update(renderer, scene, camera, controls);
});
}
// scene = {
// let scene = this;
// if (!scene) {
// scene = new THREE.Scene();
// scene.background = new THREE.Color('#f5f5f5');
// scene.add(box, plane, light);
// }
// return scene;
// }
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
