Sailing in data ocean.
Gunnerus = ({
"attributes": {},
"designState": {
"calculationParameters": {
"LWL_design": "",
"Draft_design": "",
"Cb_design": "",
"speed": "",
"crew": "",
"K": "",
"Co": "",
"tripDuration": ""
},
"objectOverrides": {
"common": {
"fullness": ""
}
}
},
"data":{
},
"structure": {
"hull": {
"attributes": {
"LOA": "",
"BOA": "",
"Depth": "",
"APP": "",
"bulb": true,
"transom": true,
"cstern": 0,
"prismaticLengthRatio": "",
"appendices": {}
},
"halfBreadths": {
"waterlines": [],
"stations": [],
"table": []
},
"style": {
"upperColor": "pink",
"lowerColor": "grey",
"opacity": 0.6
},
"buttockHeights": {}
},
"decks": {
},
"bulkheads": {
"AB": {
}
}
},
"baseObjects": [],
"derivedObjects": []
})
Gunnerus.designState.calculationParameters.Draft_design = 2.787
Gunnerus.structure.hull.attributes.LOA = 36.25,
Gunnerus.structure.hull.attributes.BOA = 9.6,
Gunnerus.structure.hull.attributes.Depth = 6.6,
Gunnerus.structure.hull.attributes.APP = 2.2,
Gunnerus.structure.hull.attributes.prismaticLengthRatio = 0.6
Gunnerus.structure.hull.halfBreadths.stations = stations;
ship = new Vessel.Ship(Gunnerus);
ship3D = new Ship3D(ship);
{
const renderer = new THREE.WebGLRenderer({antialias: true});
const scene = new THREE.Scene();
scene.background = new THREE.Color(0xA9CCE3);
const height = 600;
const aspect = width / height;
const camera = new THREE.PerspectiveCamera(50);
camera.up.set(0, 0, 1);
scene.add(camera);
const LOA = ship.structure.hull.attributes.LOA;
camera.position.set(0.7 * LOA, 0.7 * LOA, 0.7 * LOA);
function onWindowResize() {
renderer.setSize(width, height);
camera.aspect = width / height;
camera.updateProjectionMatrix();
}
window.addEventListener('resize', onWindowResize);
const controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.target = new THREE.Vector3(LOA / 2, 0, 0);
controls.update();
invalidation.then(() => renderer.dispose());
renderer.setSize(width, height);
renderer.setPixelRatio(devicePixelRatio);
scene.add(ship3D);
const ambientLight = new THREE.AmbientLight(0xffffff, 0.3);
const mainLight = new THREE.DirectionalLight(0xffffff, 1);
mainLight.position.set(1, 1, 1);
scene.add(ambientLight, mainLight);
var animate = function () {
requestAnimationFrame( animate );
renderer.render( scene, camera );
};
animate();
yield renderer.domElement;
}
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.
