Postgresデータベースからデータ（数値座標）を取得する必要があります（私は.txtファイルが解析に適していると思っています）、解析して座標の1/5しか使用しないようにしてくださいJavaScriptでの座標（three.jsライブラリ用）SQL出力座標を解析し、JavaScript 3Dでそれらにアクセスする最も良い方法は？
私はSQLテーブルのデータをテキストファイルに取り込むことができますが、私はパースの経験が豊富ではありませんが、私はその部分もやっていると思いますが（私はJavaScriptでそれを行う方法や私はJavaでいくつかの中間ステップを使ってそれを行うことができます...？）、主な問題はJavaScriptでデータにアクセスすることです。皆さんが私の目標を達成するための最良のプロセスを肉体的に助けてくれることを願っていました。ありがとう！
編集： JavaScriptはHTML文書の中にあり、不要に複雑なThree.jsに入るためにデータベースにアクセスする必要はありません。
更新： ここまでは私がこれまで行ってきたことです。 JavaScriptとThree.jsの新機能です。ファイルを開くと、空白のWebページが表示されます。
<!DOCTYPE html>
<html>
<head>
<title>Visual Human - Custom geometry</title>
<script type="text/javascript" src="../libs/three.js"></script>
<script type="text/javascript" src="../libs/jquery-1.9.0.js"></script>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script type="text/javascript" src="../libs/stats.js"></script>
<script type="text/javascript" src="../libs/dat.gui.js"></script>
<script type="text/javascript" src="../libs/OrbitControls.js"></script>
<style>
body {
margin: 0;
overflow: hidden;
}
</style>
</head>
<body>
<div id="Stats-output">
</div>
<div id="WebGL-output">
</div>
<script type="text/javascript">
//first, brute-force attempt 03/21/17 - 03/22/17 --ferrovax
var orbit;
function init() {
var stats = initStats();
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setClearColor(new THREE.Color(0xEEEEEE, 1.0));
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.shadowMapEnabled = true;
camera.position.x = -80;
camera.position.y = 80;
camera.position.z = 80;
camera.lookAt(new THREE.Vector3(60, -60, 0));
var spotLight = new THREE.DirectionalLight(0xffffff);
spotLight.position = new THREE.Vector3(70, 170, 70);
spotLight.intensity = 0.7;
spotLight.target = bodyGeo;
scene.add(spotLight);
document.getElementById("WebGL-output").appendChild(renderer.domElement);
orbit = new THREE.OrbitControls(camera, webGLRenderer.domElement);
var step = 0;
var body = new Map();
var bodyGeo = new THREE.Geometry();
parse();
scene.add(new THREE.Mesh(bodyGeo, cubeMaterial));
parse = function(){
$.ajax({
url:'output2.txt',
success: function (data){
for each (var entry in data.split('\n')) {
var count = 0;
var nameKey;
var path = new d3.path();
var layerZ;
for each (var chunk in entry.split('\s')) {
if (/[0-9]+/.test(chunk)) {
//chunk is the layer number
layerZ = parseInt(chunk);
} else if (/[^0-9]+/.test(chunk)) {
//chunk is the name, so check if it exists, make it if necessary
if (!body.has(chunk)) {
nameKey = chunk;
body.set(nameKey, path);
}
} else {
//chunk is the entire block of coordinates
for each (var coordinatePair in chunk.split(':')) {
if (count % 20 == 0) {
var xy = coordinatePair.split(',');
path.lineTo(xy[0], xy[1]);
}
count++;
}
}
}
path.closePath();
var shape = transformSVGPathExposed(path.toString());
var options = {
steps: 2,
amount: 200,
bevelEnabled: true,
bevelThickness: 1,
bevelSize: 1,
bevelSegments: 1
};
var outline = createMesh(new THREE.ExtrudeGeometry(shape, options));
outline.updateMatrix();
bodyGeo.merge(outline.geometry, outline.matrix);
}
}
});
}
var gui = new dat.GUI();
render();
function render() {
stats.update();
requestAnimationFrame(render);
renderer.render(scene, camera);
}
function initStats() {
var stats = new Stats();
stats.setMode(0); // 0: fps, 1: ms
stats.domElement.style.position = 'absolute';
stats.domElement.style.left = '0px';
stats.domElement.style.top = '0px';
document.getElementById("Stats-output").appendChild(stats.domElement);
return stats;
}
}
window.onload = init
</script>
</body>
</html>潜在的な問題がたくさんあります。基本的には、座標データを使用して2Dアウトラインを作成し、それらを押し出して全体の3Dモデルにマージしようとしています。私はlayerZ変数を使用していません。これは、z軸のどこに押し出された2Dアウトラインが他のものと相対的であるかを決定することになっています（空間内のパンケーキを積み重ねることを想像してください）。出力のいくつかの並べ替えを得るための任意のアドバイスは非常に高く評価されるだろう。それはまた私がそれについて考えているカメラの配置かもしれません...その側面を設定するアドバイスも同様に歓迎されるでしょう。
私がthree.jsライブラリに言及したとき、私はそうしませんでした。そのライブラリはデータをインポートするために使用するもので、私は最終的にthree.jsを使って座標データを混乱させようとしています。 – Ferrovax
私は自分の制約を前提としてこれをどのように進めるのか、私の答えを更新しました。 –
私が追加したコードスニペットは非常に機能不全です。それをきれいにする方法に関するすべてのアドバイスについて、事前に感謝します。ファイルに直接データをロードしようとしているという事実を批判しないでください。私は問題で選択肢がありません。 – Ferrovax