質問するログイン新規登録

質問編集履歴

2

文章を分かりやすく

2018/03/13 04:16

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -22,7 +22,8 @@
22
22
  scene.add(mesh);
23
23
  ```
24
24
  球体自体は生成されますが、キャンバスの中身は描画されていません。
25
+ また、キャンバスも特に変化がありません。
25
- また、キャンバスも特に変化なく(マッピングできた場合どうなるのかわかりませんが)あります。
26
+ (マッピングできた場合どうなるのかわかりませんが)
26
27
 
27
28
  ### 補足情報
28
29
  - Windows10

1

情報の追加

2018/03/13 04:16

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -29,4 +29,35 @@
29
29
  - three.js 最新
30
30
 
31
31
  調べてみても、上記の方法しか紹介されておらず、どうしたものかと悩んでいます。
32
- アドバイスをいただければ幸いです。
32
+ アドバイスをいただければ幸いです。
33
+
34
+ ### Canvasの内容 ※追記
35
+ キャンバスには、世界規模の風速データを非同期で描画する処理を行っています。
36
+ http://www.techscore.com/blog/2015/12/13/wind_visualization/
37
+ ↑データとコードはこちらを参考にしています。
38
+
39
+ キャンバスは、X:1024, Y:512のサイズで2D描画しています。
40
+
41
+ ```
42
+ var canvas = d3.select("body").append("canvas")
43
+ .attr("id", "canvas")
44
+ .attr("width", 1024)
45
+ .attr("height", 512);
46
+
47
+ var xhr = new XMLHttpRequest();
48
+ xhr.open('GET', './wind.ieee', true);
49
+ // responseType="arraybuffer":サーバに期待するレスポンスタイプを変更できる。
50
+ xhr.responseType = 'arraybuffer';
51
+ xhr.onload = function(e) {
52
+ var buffer = this.response;
53
+ var wind = new Float32Array(buffer.byteLength / 4);
54
+ var dataview = new DataView(buffer);
55
+ for (var i = 0; i < wind.length; i++) {
56
+ wind[i] = dataview.getFloat32(i * 4);
57
+ }
58
+ App.run(canvas, wind);
59
+ }
60
+ xhr.send();
61
+ ```
62
+
63
+ 稚拙な文章で申し訳ないのですが、アドバイスや解決へのアプローチ方法などいただければ幸いです。