-
Notifications
You must be signed in to change notification settings - Fork 0
/
index-geoffair.html
249 lines (216 loc) · 8.89 KB
/
index-geoffair.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Language"
content="en-us">
<meta name="GENERATOR"
content="Microsoft FrontPage 5.0">
<meta name="ProgId"
content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type"
content="text/html; charset=us-ascii">
<meta name="author"
content="geoff mclane">
<meta name="keywords"
content="geoff, mclane, geoffmclane, computer, consultant, programmer, FlightGear, SimGear, PLIB, zlib, openal, pthreads, freeglut, openscenegraph">
<meta name="description"
content="flightgear - deveopment of a multiplayer map, and 3D aircraft display.">
<title>
Three.js json loading
</title>
<link rel="stylesheet"
type="text/css"
href="css/fgcode.css">
<style type="text/css">
<!-- /* additional styles */
.nh2 { font-size: 160%; font-weight: bold; background-color: #CCCCFF }
.nh3 { font-size: 130%; font-weight: bold; background-color: #eCeCFF }
/* light orange */
.nh4 { font-size: 110%; font-weight: bold; background-color: #FFc080 }
-->
</style>
<base target="_blank">
</head>
<body>
<h1>
<a name="top"
id="top"></a>Three.js json loading
</h1>
<p class="ctr">
external: <a target="_self"
href="../index.htm">main fg index</a>
<br>
internal: <a target="_self"
href="#preamble">preamble</a> <a target="_self"
href="#viewer">viewer</a> <a target="_self"
href="#download">download</a> <a target="_self"
href="#end">end</a>
</p>
<h2 class="nh2">
<a name="preamble"
id="preamble"></a>Preamble:
</h2>
<p>
Theo pointed the way to load Three.js json models (3js) into a global scene. The initial, very
manual way to get this 3js was to load the flightgear ac3d (.ac) model into blender, then
export it as dae, then load that dae and export it as 3js. It works, but is quite cumbersome.
And the blender UI take some understanding...
</p>
<p>
I had already started experiments with some ac3d2gl sources. That is load an ac3d model file
and render it in GL. And the source of these experiments are in my fgtool repo -
<a href="http://gitorious.org/fgtools/ac3d2gl">http://gitorious.org/fgtools/ac3d2gl</a> - but
this only started to identify the problems... While MOST ac3d *.ac files list all faces with 3
(or 4) vertices, some like say the fg 707.ac have faces with 64 vertices! How to render these
in GL?
</p>
<p>
My next attempt was in a project called ac2glview ( TODO -
<a href="http://gitorious.org/fgtools/ac2glview">http://gitorious.org/fgtools/ac2glview</a> ).
Here I developed an ac3d_browser2 program which loads an ac3d *.ac file, shows a GL view, and
lists the components. Each component can be expanded in the list, selected, and an attempt is
made to give a GL view of that single item. And, if not needed in the final model, like light
cones, wheels, other artifacts, they can be deleted, and a cleaned .ac files written.
</p>
<p>
To this program I also added the ability to 'export' the model directly to 3js, and while this
works well for a large number of model files, it fails when any of the faces contains more than
3 or 4 vertices. Lots of effort was put into solving this, but could not get it right...
</p>
<p>
I messed around with some other sources, like
<a href="http://mview.sourceforge.net/">mview</a>, which supports a considerable list of 3D
formats - <a href="http://www.ipab.informatics.ed.ac.uk/mvu/">PMesh</a>,
<a href="http://gts.sourceforge.net/">GTS</a>, <a href="http://www.geomview.org/">OFF/COFF</a>,
<a href="http://graphics.stanford.edu/data/3Dscanrep/">ply</a>,
<a href="http://en.wikipedia.org/wiki/VRML">VRML 1/2</a>, shallo?,
<a href="http://www.vtk.org/">vtk</a> and
<a href="http://en.wikipedia.org/wiki/Wavefront_.obj_file">obj</a>. But on reviewing most of
these again all faces have 3 vertices, and in some rare cases 4. Never values like 64!
</p>
<p>
This track led me deeper into the <a href="http://www.geomview.org/">geomview</a> (OFF/COFF)
source, but while it compiles and runs well in Ubuntu linux, it proved too difficult to compile
in Windows. It is too mixed up with Motif and X11!
</p>
<p>
By chance I ran across assimp (
<a href="http://assimp.sourceforge.net/">http://assimp.sourceforge.net/</a> ). To quote from
their websit "<strong>Open Asset Import Library</strong> (short name: Assimp) is a portable
Open Source library to import various well-known 3D model formats in a uniform manner. The most
recent version also knows how to export 3d files and is therefore suitable as a general-purpose
3D model converter.". And added to that it supports 'scripting' of the load, post processing
and exporting...
</p>
<p>
Naturally the loading included ac3d *.ac model files, but it only exported
<a href="http://collada.org/">dae</a>,
<a href="http://en.wikipedia.org/wiki/Wavefront_.obj_file">obj</a>,
<a href="http://www.stereolithography.com/exporting-stl-files.php">stl</a> and
<a href="http://graphics.stanford.edu/data/3Dscanrep/">ply</a>. But I knew one of these must
have the same constraints as 3js, namely ALL faces must be described as 'triangles', that is
sets of 3 vertices. So I copied the 'obj' exporter, and changed the code to output 3js, AND IT
WORKED ;=))
</p>
<p class="nmb">
So then we have the action chain -
</p>
<ol class="nmt">
<li>load the model into ac3d_browser2
</li>
<li>review and delete unwanted components if any
</li>
<li>write a modified new *.ac file
</li>
<li>load that ac file into assimp_viewer
</li>
<li>exort as 3js
</li>
</ol>
<p>
And bingo we have the desired web 3js model file. Some of this process is aided by the fact
that both programs, ac3d_browser2 and assimp. On exit ac3d_browser2 will generate a 'script' to
repeat the process, whihc includes a script to run assimp and export the 3js. Namely the last
two steps listed above.
</p>
<p>
So excluding the manual review step 2, I was able to create a big list of FG model ac file -
aclist-ac.txt - and use a batch file to process them ALL. This gave me a set of 435 3js files
to load and view. They range in size from the small 5,310 byte
<a href="ac/paperairplane.js">paperairplane.js</a>, to the massive 73,155,108 byte
<a href="ac/Vostok-1-TDU.js">Vostok-1-TDU.js</a>
</p>
<p class="top">
<a target="_self"
href="#top">top</a>
</p>
<hr class="mini">
<h2 class="nh2">
<a name="viewer"
id="viewer"></a>Viewer:
</h2>
<p>
<a href="load-one2.html">One-by-one</a> - Load an view each of the 435 models separately. It
sports a [next] and [back] links, and a small GUI to select any of the 435 models, with some
display options.
</p>
<p>
<a href="load-all.html">Load a set</a> - This loads a set of about 20 planes into the scene
</p>
<p>
<a href="load-one.html">Old 1x1</a> - Early version of the one by one viewing
</p>
<a name="download"
id="download"></a>
<p>
<a href="ac-01.zip">ac-01.zip</a> - A zip file containing the 435 3js model files (190MB)
</p>
<p>
And just to be sure I got everything <a href="globe-02.zip">globe-02.zip</a> is the entire
contents of this 'globe' folders, including 4 sub-directories, only excluding the above zip,
which is effectively the <b>ac</b> folder contents, so that folder is also excluded...
</p>
<p>
That <b>ac</b> folder contains 436 <model>.js files, 414 of which are used in the above
1x1 display (load-one2.html). It also contains 19 other <model>.script, and 1
<model>.txt which are the scripts which can be fed to ac3d_browser2 to regenerate that
model in three.js.
</p>
<p class="nmb">
The other 4 folders are :-
</p>
<ul class="nmt">
<li>
<b>data</b> - contains 61 <model>.js files, which I have manually 'cleaned' with
ac3d_browser2, and in most cases there is also the modified <model>.ac (40), along with
some 36 <model>.txt scripts to redo this extraction.
</li>
<li>
<b>images</b>, <b>js</b> and <b>css</b> - containing the images, js and css used here.
</li>
</ul>
<p class="top">
<a target="_self"
href="#top">top</a>
</p>
<hr class="mini">
<p align="right">
EOP - index.htm
</p>
<p>
<a name="end"
id="end"></a> <a target="_blank"
href="http://tidy.sourceforge.net/"><img border="0"
src="images/checked_by_tidy.gif"
alt="checked by tidy"
width="32"
height="32"></a> <a href="http://validator.w3.org/check?uri=referer"
target="_blank"><img src="images/valid-html401.gif"
alt="Valid HTML 4.01 Transitional"
width="88"
height="31"></a>
</p>
<!-- 2013/07/26 - geoffair.net/fg/globe - initial page -->
</body>
</html>