ben-burlingham
10 years ago
parent
1a30ee84b7
commit
3a1d505d8b
14 changed files with 2285 additions and 55 deletions
@ -0,0 +1,156 @@ |
|||||||
|
'use strict'; |
||||||
|
|
||||||
|
var BuoyAnalysisChart3 = { |
||||||
|
|
||||||
|
h: 258, |
||||||
|
|
||||||
|
w: 498, |
||||||
|
|
||||||
|
/** |
||||||
|
* |
||||||
|
*/ |
||||||
|
buildCamera: function() { |
||||||
|
var viewAngle = 45; |
||||||
|
var aspectRatio = BuoyAnalysisChart3.w / BuoyAnalysisChart3.h; |
||||||
|
var near = 1; |
||||||
|
var far = 10000; |
||||||
|
|
||||||
|
return new THREE.PerspectiveCamera(viewAngle, aspectRatio, near, far); |
||||||
|
}, |
||||||
|
|
||||||
|
/** |
||||||
|
* |
||||||
|
*/ |
||||||
|
getLighting: function() { |
||||||
|
var pointLight = new THREE.PointLight('#fff'); |
||||||
|
|
||||||
|
pointLight.position.x = 50; |
||||||
|
pointLight.position.y = 40; |
||||||
|
pointLight.position.z = 40; |
||||||
|
|
||||||
|
return [pointLight]; |
||||||
|
}, |
||||||
|
|
||||||
|
/** |
||||||
|
* |
||||||
|
*/ |
||||||
|
draw: function() { |
||||||
|
var renderer = new THREE.WebGLRenderer({ antialias: true }); |
||||||
|
renderer.setSize( BuoyAnalysisChart3.w, BuoyAnalysisChart3.h ); |
||||||
|
renderer.setClearColor('#fff'); |
||||||
|
|
||||||
|
document.getElementById('chart3').appendChild( renderer.domElement ); |
||||||
|
|
||||||
|
var scene = new THREE.Scene(); |
||||||
|
|
||||||
|
var mat = new THREE.LineBasicMaterial({ linewidth: 3, color: '#f0f' }); |
||||||
|
|
||||||
|
var axisHelper = new THREE.AxisHelper(500); |
||||||
|
scene.add(axisHelper); |
||||||
|
|
||||||
|
BuoyAnalysisChart3.getLighting().forEach(function(light) { |
||||||
|
scene.add(light); |
||||||
|
}); |
||||||
|
|
||||||
|
|
||||||
|
var obj = new THREE.Object3D(); |
||||||
|
|
||||||
|
BuoyAnalysisMap.reticle.stations.forEach(function(station, index) { |
||||||
|
if (index > 0) { |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
|
var h, geo, mat, mesh; |
||||||
|
|
||||||
|
|
||||||
|
// Ribbons. Colorize stations.
|
||||||
|
var width = 40; |
||||||
|
var height = 300; |
||||||
|
var width_segments = 1; |
||||||
|
var height_segments = BuoyAnalysisData.years.end - BuoyAnalysisData.years.start; |
||||||
|
|
||||||
|
var geo = new THREE.PlaneGeometry(width, height, width_segments, height_segments); |
||||||
|
|
||||||
|
for (var year = BuoyAnalysisData.years.start, i = 0; year <= BuoyAnalysisData.years.end; year++, i++) { |
||||||
|
h = BuoyAnalysisData.stationJson[station]['a' + year]['wt']['y'] * 10; |
||||||
|
|
||||||
|
// if (h === 0) {
|
||||||
|
// continue;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// geo = new THREE.PlaneGeometry(30, 30, 1);
|
||||||
|
// mat = new THREE.MeshLambertMaterial( {color: 'rgb(100, 100, 0)'} );
|
||||||
|
// mesh = new THREE.Mesh( geo, mat );
|
||||||
|
|
||||||
|
// geo.applyMatrix( new THREE.Matrix4().makeTranslation( 0, 0, 0 ) );
|
||||||
|
// mesh.position.set((year - BuoyAnalysisData.years.start) * 32, index * 32, h);
|
||||||
|
// obj.add(mesh);
|
||||||
|
|
||||||
|
geo.vertices[2 * i].z = h; |
||||||
|
geo.vertices[2 * i + 1].z = h; |
||||||
|
} |
||||||
|
|
||||||
|
// for(var i = 0; i < plane.vertices.length / 2; i++) {
|
||||||
|
// plane.vertices[2 * i].z = Math.pow(2, i / 20);
|
||||||
|
// plane.vertices[2 * i + 1].z = Math.pow(2, i / 20);
|
||||||
|
// }
|
||||||
|
|
||||||
|
var mesh = new THREE.Mesh(geo, new THREE.MeshLambertMaterial({color: 0xccffcc})); |
||||||
|
mesh.material.side = THREE.DoubleSide; |
||||||
|
// mesh.doubleSided = true;
|
||||||
|
|
||||||
|
// mesh.rotation.y = Math.PI/2-0.5;
|
||||||
|
mesh.position.y = index * 100 + height / 2; |
||||||
|
obj.add(mesh); |
||||||
|
}); |
||||||
|
|
||||||
|
obj.position.set(150, 0, 0); |
||||||
|
scene.add(obj); |
||||||
|
|
||||||
|
var camX = -20; |
||||||
|
var camY = -300; |
||||||
|
var camZ = 150; |
||||||
|
|
||||||
|
var tgtX = 425; |
||||||
|
var tgtY = 300; |
||||||
|
var tgtZ = -20; |
||||||
|
|
||||||
|
|
||||||
|
// var geoCam = new THREE.BoxGeometry(10, 10, 10);
|
||||||
|
// var matCam = new THREE.MeshLambertMaterial( {color: '#f0f'} );
|
||||||
|
// var boxCam = new THREE.Mesh( geoCam, matCam );
|
||||||
|
|
||||||
|
// boxCam.position.set(camX, camY, camZ);
|
||||||
|
// scene.add(boxCam);
|
||||||
|
|
||||||
|
// var geoTgt = new THREE.BoxGeometry(10, 10, 10);
|
||||||
|
// var matTgt = new THREE.MeshLambertMaterial( {color: '#0ff'} );
|
||||||
|
// var boxTgt = new THREE.Mesh( geoTgt, matTgt );
|
||||||
|
|
||||||
|
// boxTgt.position.set(tgtX, tgtY, tgtZ);
|
||||||
|
// scene.add(boxTgt);
|
||||||
|
|
||||||
|
var camera = BuoyAnalysisChart3.buildCamera(); |
||||||
|
camera.up.set( 0, 0, 1 ); |
||||||
|
camera.position.set(camX, camY, camZ); |
||||||
|
|
||||||
|
var controls = new THREE.OrbitControls( camera, renderer.domElement ); |
||||||
|
controls.target = new THREE.Vector3(tgtX, tgtY, tgtZ); |
||||||
|
|
||||||
|
// // Range is 0 to Math.PI radians.
|
||||||
|
// controls.minPolarAngle = 50 * Math.PI / 180; // radians
|
||||||
|
// controls.maxPolarAngle = 90 * Math.PI / 180; // radians
|
||||||
|
|
||||||
|
// // How far you can orbit horizontally, upper and lower limits.
|
||||||
|
// // If set, must be a sub-interval of the interval [ - Math.PI, Math.PI ].
|
||||||
|
// controls.minAzimuthAngle = -90 * Math.PI / 180; // radians
|
||||||
|
// controls.maxAzimuthAngle = 0 * Math.PI / 180; // radians
|
||||||
|
controls.update(); |
||||||
|
|
||||||
|
(function animate() { |
||||||
|
requestAnimationFrame(animate); |
||||||
|
renderer.render(scene, camera); |
||||||
|
controls.update(); |
||||||
|
})(); |
||||||
|
} |
||||||
|
}; |
||||||
@ -0,0 +1,8 @@ |
|||||||
|
#chart3 { |
||||||
|
border:1px solid #f00; |
||||||
|
height:260px; |
||||||
|
left:20px; |
||||||
|
position:absolute; |
||||||
|
top:640px; |
||||||
|
width:500px; |
||||||
|
} |
||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
Loading…
Reference in new issue