How to export file from Maya to .wrl, .x3d and to HTML/XHTML for Web3D [EN/TH Languages]

How to export file from Maya to .wrl, .x3d and to HTML/XHTML for Web3D

Step 1:
[EN] Model and shade in Maya as usual. You should use png images for texturing.
[TH] เปิด/สร้างไฟล์ใน Maya, สำหรับ Texture ที่ใช้ควรเป็น .png

Step 2:
[EN] Open ‘Window | Settings/Preferences | Plug-in manager’ and check the ‘loaded’ or ‘Auto load’ option vrml2Export.
[TH] เปิดเมนูที่ชื่อว่า “Window -> Settings/Preferences -> Plug-in manager” แล้วเลือก “Loaded” และ “Auto load” ที่ vrml2Export

Step 3:
[EN] Open the Export dialog under ‘File | Export All..’, Enter a filename (.wrl suffix) and switch to filetype ‘vrml2′.
Don’t forget to check the folowing export options:
Hierarchy: Full
Texture Options: Original
Export: Normals and Textures
Click the “Export All” button. This will create a vrml2 file in your scenes folder.
[TH] ในการ Export เลือกที่เมนู “File -> Export All..” ใส่ชื่อไฟล์เข้าไป ไม่ต้องเติม .wrl ตามหลัง โดยให้ไปเลือกที่ชนิดของไฟล์ให้เป็น “vrml2″ ซึ่งไฟล์ที่ออกมาจะเป็น .wrl
ในการ Export ให้เลือก Options ต่างๆดังนี้ด้วย
1. Hierarchy: Full
2. Texture Options: Original
3. Export: Normals and Textures

Step 4:
Export VRML file (.wrl) to X3D (.x3d) and HTML/XHTML (X3DOM)
[EN] Open a terminal or command prompt, change to the folder containing your vrml2 model and your textures and run aopt (part of Instant Reality) by typing the following command
[TH] เปิด Terminal หรือ Command Prompt และไปยังโฟลเดอร์ที่ไฟล์ VRML (.wrl) อยู่ และที่ Textures อยู่ด้วยเช่นกัน แล้ว Run “aopt” ซึ่งจะได้มาหลังจากการติดตั้ง Instant Reality แล้ว ซึ่งสามารถดาวน์โหลดได้จากลิ้งนี้

For Non-Texture file (Mac OS X)
/Applications/Instant\ Player.app/Contents/MacOS/aopt -i pipe.wrl -u -N pipe.html

For texture file (Mac OS X)
/Applications/Instant\ Player.app/Contents/MacOS/aopt -i pipe.wrl -d Switch -f ImageTexture:repeatS:false -f ImageTexture:repeatT:false -u -N pipe.html

For Windows
สำหรับ Windows ไม่ต้องลากไปจนถึงตำแหน่งที่ aopt อยู่นะครับ เพียงแค่
aopt -i pipe.wrl -u -N pipe.html

สำหรับข้อมูลเพิ่มเติมสำหรับการใช้คำสั่ง aopt
Convert VRML to X3D-XML
aopt -i foo.wrl -x foo.x3d

Convert VRML or X3D-XML to HTML
aopt -i foo.x3d -N foo.html

Convert VMRL or X3D-XML to XHTML
aopt -i foo.x3d -M foo.xhtml

Optimization and build DEF/USE reuses while converting with “-u”
aopt -i foo.x3d -u -N foo.html

ตำแหน่งที่ aopt อยู่
Windows: C:\Program Files\Instant Player\bin\aopt.exe
Mac: /Applications/Instant Player.app/Contents/MacOS/aopt
Linux: /opt/instantReality/bin/aopt

[EN] or use this method to transcoding from VRML to X3D or reward.
[TH] หรืออีกวิธีในการแปลงโค้ดจาก VRML ไปเป็น X3D หรือแปลงกลับ

Transcoding VRML to X3D or X3D to VRML
[EN] Via Online Transcoding
[TH] สำหรับการ Export VRML (.wrl) ไปเป็น X3D (.x3d) หรือการแปลงกลับสามารถใช้ตัวแปลงออนไลน์ได้ครับ ตามลิ้งข้างล่างนี้

http://www.instantreality.org/tools/x3d_encoding_converter/

Step 5:
[EN] Maya is using absolute path names. Therefore, open your html file with a standard text editor (vi, wordpad,…) and remove all pathes from ImageTexture
[TH] หลังจาก Export แล้ว Maya จะใช้ชื่อ Path ตามขั้นตอนแรกที่เราใช้สร้างโมเดลใน Maya เพราะฉะนั้นต้องเข้าไป Edit Code ในไฟล์ที่เรา Export มาแล้ว ซึ่งสามารถใช้ Text Editor ทั่วไปได้ เช่น Vim, Notepad++ หรือ Wordpad และอื่นๆ ในการแก้ไข Path ดังกล่าวเพื่อที่จะสามารถนำ Texture มาแสดงได้อย่างปกติ

Step 6:
[EN] Copy html and textures into your web folder and open the website with your x3dom capable browser.
[TH] Copy ไฟล์ทั้งหมดของเราที่ใช้ (HTML และ Textures) Upload ขึ้น Server และเปิดใช้โดย Browsers ที่รองรับ WebGL ก็เป็นอันเสร็จสิ้นกระบวนการ : )

Example
Pipe in VRML or X3D file (via BS Contact)

Pipe in VRML or X3D file (via BS Contact)

Pipe in X3DOM

Pipe in X3DOM

For more information:
1. Generic 3D Data Convertion
2. Maya Export

About these ads

12 thoughts on “How to export file from Maya to .wrl, .x3d and to HTML/XHTML for Web3D [EN/TH Languages]

  1. ถ้าสร้าง object จาก 3d max เช่น ตึกใหญ่ ๆ เวลา Export นี่คล้ายกันกับ Maya หรือป่าว ?? จำเป็นต้องใช้ Plugin เสริมไหม ? เวลาแสดงผลบน web browser ค่ะ

    1. จำเป็นต้องใช้ Plugin ครับ
      สำหรับ 3Ds Max มี Plugin ในการ Export เป็นไฟล์ .wrl หรือ .x3d มากกว่า Maya ด้วยครับ : )
      หรือถ้าเป็นไฟล์ .3ds สามารถ Import เข้า Blender แล้ว Export เป็น .x3d จาก Blender เลยก็ได้ครับ ถ้าไม่มี Plugin : D
      ปล. แต่ไม่ทราบว่าตอนนี้ปัจจุบัน 3Ds Max มันไปถึงไหนแล้วนะครับ ไม่รู้ว่าจะ Export ได้จากตัวมันเลยเหมือน Blender ไหม ไม่ได้จับ 3Ds Max มาเกือบ 3 ปีแล้วครับ ตั้งแต่อยู่ปี 1

      1. พอดีใช้ 3Ds Max 10 ค่ะ ซึ่งตอนนี้มันไปถึง ver. 12 แล้ว :))’ plugin ที่ใช้ตอนนี้ ใช้ Bs Contact ค่ะ ถ้าได้ไฟล์เป็น .wrl หรือ .x3d ออกมาแล้วนี่สามารถขึ้นบน web browser ได้หรือป่าวค่ะ ?? จำเป็นต้องแปลงไฟล์ให้อยู่ในรูปแบบของ html หรือ xhtml อีกไหมค่ะ ? :D

    2. [ขอขึ้นมาตอบข้างบนนะครับ มันตอบซ้อนกันเกิน 3 ไม่ได้ ฮี่ๆ]

      BS Contact Plugin ก็เจ๋งอยู่นะครับ พนักงานที่นี่หน้าตาดีครับ ฮาๆๆๆ (ผมล้อเล่นน่ะ) ;p
      ถ้า export ออกมาเป็น .wrl ก็สามารถใช้ตัว BS Contact convert เป็น .x3d ได้เลยครับ
      แต่ถ้าจะเปิด VRML/X3D ผ่าน Web browser เลย Plugin ก็สามารถทำได้ครับ แต่ถ้าจะเอาเป็น Native เลย แบบ WebGL (หรือในกรณีหัวข้อนี้คือเปลี่ยน X3D มาใช้ X3DOM) ก็จำเป็นต้องแปลงไฟล์อีกทีครับ ตามหัวข้อที่ 4 ในโพสนี้ หรือถ้าไม่ต้องแปลงอะไรวิธีพิเศษเลย ก็โค้ดเอาเลยก็ได้ครับ เดี้ยวผมเขียนบล๊อคในหัวข้อนี้ให้นะครับ : )

  2. ขอบคุณมาก ๆ เลยค่ะ กำลังศึกษาภาษา x3d อยู่พอดีเลยค่ะ ไม่ทราบว่าพอมีเอกสารข้อมูลเกี่ยวกับภาษา x3d บ้างหรือป่าว ?? ถ้ามีช่วยส่งข้อมูลมาให้ทาง E-mail เพื่อศึกษาเพิ่มเติมหน่อยนะค่ะ ^^” ภาษาไทยก็ดีมาก ๆ เลยค่ะ เข้าใจง่าย เพราะตอนนี้อ่านแต่ Text จนมึนน 555

    ขอบคุณล่วงหน้าค่ะ ,, : )

    1. ไม่เป็นไรครับ ส่วนเรื่องหนังสือไม่มีภาษาไทยอ่ะครับ ขอโทษด้วยครับ ไม่เช่นนั้นก็คงต้องแปลกันเอาเอง ไม่มีเวลาว่างมากขนาดนั้นครับ เรียนเทอมสุดท้ายด้วย ระยะอันตรายครับ ฮาๆๆ แต่ถ้ามีอะไรถามมาได้ครับ จะพยายามช่วยครับ 5555

      1. ไม่เป็นไรค่ะ ,, อ่านไปทำไป เดี๋ยวคงได้เรื่องเอง 555 ลุย ๆ อยากรู้ ก็ต้องลุยค่ะ ขอบคุณที่ให้คำปรึกษานะค่ะ เดี๋ยวมีปัญหาอะไรจะถามอีกทีนะค่ะ ^^

  3. ขอรบกวนหน่อยค่ะ ตอนนี้ได้โมเดลขึ้นเว็บแล้ว แต่มีปัญหาเรื่องตำแหน่งของโมเดลควบคุมยาก เรามีวิธีในการควบคุมการดูโมเดลยังไงบ้างค่ะ เช่น เลื่อนขึ้น เลื่อนลง ซูมเข้า ออก เป็นต้น ขอบคุณค่ะ
    ตอนนนี้ลองรันใน localhost เท่านัน้

    1. หากต้องการจะตั้งให้ตัวโมเดลอยู่ตรงกลาง ต้องรู้ขนาดของโมเดลด้วยครับว่าโมเดลนั้นกว้าง ยาว สูง เท่าไหร่ ผมยกตัวอย่าง กล่อง ที่กว้าง ยาว สูง เท่ากับ 5 5 5 หากมีโมเดลชิ้นเดียวเราสามารถให้เขาอยู่ในตำแหน่ง 0 0 0 ได้ครับ แต่หากมีมากกว่า 1 โมเดลในซีนนั้นขึ้นไปต้องกำหนดให้กล่องนั้นอยู่ที่ตำแหน่ง -2.5 -2.5 -2.5 โมเดลนั้นถึงจะอยู่ที่จุดศูนย์กลางพอดี แต่วิธีนั้นเป็นแค่วิธีคร่าวๆครับไม่ค่อยแนะนำ อีกวิธีคือให้ตั้งค่าเริ่มต้นของ Viewpoint โดยใช้ Viewpoint Node ในภาษา X3D ดูครับ หรืออีกวิธีหนึ่งคือ ใช้ Runtime API ครับ ให้ NavigationType เริ่มต้นเป็น ViewAll เราก็จะเห็นโมเดลทั้งหมดในซีนนั้นเลยแบบอัตโนมัติ ส่วนการซูมเข้า ซูมออก เราใช้วิธี Scroll Mouse เข้าออกได้เลยครับ โดยเลือก NavigationType เป็น Examine โดย Type นี้ก็สามารถที่จะหมุนตัววัตถุได้ด้วย ส่วนการเลื่อนขึ้น เลื่อนลงนี่ต้องใช้แบบ lookAround ครับ

      ผมได้เขียนข้อมูลเกี่ยวกับ NavigationType/Viewpoint และ Video ตัวอย่างไว้ที่นี่ ลองดูครับ http://hassadee.com/2012/01/03/the-x3dom-runtime-api-viewpoint-setting/

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s