Flash Model Viewer v0.45
polycounter lvl 18
http://www.willhawthorne.com/model_viewer.html
Now that I have a stable job again, I've been using my free time to revisit some of my more promising projects. Some tricks that I learned at work have made it possible to pull my Flash Model Viewer out of the closet and spruce it up. This first update is sans-interface, but it still brings a lot of improvements to my previous design. Click the link above to see it in action. Here's a quick rundown of the new features.
1. The model viewer no longer reads from an XML file. Now all of the data it uses is loaded directly using FlashVars. These are loaded in the object and embed tags for the flash file.
2. Writing out object and embed tags are really annoying. So is escaping special characters for FlashVars. The viewer now has an accompanying Javascript file that handles both of these tasks for you. Two lines of code in your html file is enough to get everything up and running.
3. Because of the new method for loading variables, it is now possible to have multiple instances of the player on a single page.
4. It is no longer necessary to have different versions of the player for different models, the player is now infinitely reusable. Just pass a different model path into the Javascript call, it's as easy as that.
5. Scaling for the model player is handled automatically. You can define whatever width and height you want in the javascript call, and all elements within the player will automatically compensate. Once I include GUI elements, these will adjust their positions to meet the user's needs.
6. Variables for the model's scaling and vertical origin are also passed into the player. This makes it possible to adjust how the model is displayed without re-exporting it. If your model is looking a little too small, just change the scaling variable and you can size it up in the html file. If your model's origin is at its feet, you can adjust the origin upwards so that the model is centered in the player.
Replies
can it handle high density mesh's?
i recently came along this nifty flash player:
http://wotlk.wowhead.com/?item=34092
you have to click on "view in 3d" at the top.
the viewer isnt available for public but i think the presentation and usabilty is awesome. the motionblur effect is pretty sweet too.
would be awesome if a viewer like this would be available for everyone.
just posting this for your inspiration.
good luck with the project
If you play around with it a little, you notice that their model player doesn't have a motion blur when rotating the model up and down, only when you click and drag your mouse side to side. They are creating the motion blur using Flash's "blur" filter, and giving it an X value. (but not a Y value) Most 3D flash APIs give you the option of specifying a sprite to use as your render container, and most of flash's special effects and filters can be applied to a sprite.
I was actually noodling over how I should go about handling the user interface for my player. I definitely want to have different rendering options, such as flat, wireframe, and textured. I was thinking maybe have little button on one of the sides, that when you press it it pops out a panel with those options on it, and when you press it again it hides the pane. How do you guys usually like to have your model rotation handled? I was thinking sliders, but after looking at that WoW viewer, I'm thinking mouse click-and-drag controls might be cleaner and more intuitive.
As to how this player can be used...it actually already can. If you view the source code for the html page I posted, you can find links to all the files you need. All you really need to run the thing is the SWF file, and the javascript file. Technically, you don't even need the javascript file, but it makes things a LOT easier, so you would want it. Anyone familiar with web design and html code could go to the example site, get the links they needed, download the files, and be off to the races. That's actually why I put the copyright information in the upper right hand corner.
P.S. Once I've developed a few of the basic GUI elements, I'll release a test version for you guys to try out. If it goes over well, perhaps even a polycount-themed version could be constructed.
Theoretically...yes. Realistically...no. The Flash player is constrained by the CPU of the computer its running on. This player could load up a model with any number of polygons. But that doesn't mean that it would perform well. I will have to do more testing to be sure, but I'm thinking you won't want to go much higher than 5000 polys on models you display here. It's going to be much more geared toward low-poly work. The player will also not have any Normal map support. The API I'm using has support for several different rendering techniques, but high-end techniques like bump and normal mapping are too intensive. You need GPU support for that.
It's possible that Silverlight could be used to construct a more robust model viewer. Silverlight has GPU support, and can handle much more intensive 3D rendering. The problem is that Silverlight also has a much smaller install base, and I'm not sure how cross-browser and cross-platform compatible it is. I wanted to make a simple model viewer that everyone would be able to use and view.
- freeze version: renders high poly models but only once or per click. with this it would be still interactive but not realtime - so models with higher polycounts can be used as well.
- *.obj and *.FBX support or something less odd as DAE
- deafault non anti-aliasing as it might crash or freeze on older computers with the default anit- aliasing of 4x
- a event for when leaving the flash movie so it pauses as soon as you leave the flash movie with the mouse- and runs back again as soon as you move with the mouse over it.
In response to some of the replies I got, I've been investigating the other available 3D Flash engines. I've focused for the last few days on Away3D, and have actually spent quite a few hours playing around with it. I've found that Away3D has some of the best and most accurate Z-sorting out of the the major three. And its rendering performance outstrips Sandy 3D. However, I finally decided that I would not use it for this project.
Away3D has support for more formats than Sandy 3D does. However, the way in which it handles loading its various formats is a little constrained. Specifically, several of the formats it supports provide no way of changing their materials after they've been loaded. One of the features that I absolutely wanted to have was the option of viewing models with different materials, like smooth shading, flat shading, wire shading, and textured. For a viewer that focuses on evaluating on-line models, I would think that kind of functionality would be a must. With Away3D, you would pretty much have to load up MD2 files in order to do that.
I started working with PaperVision3D today. I had to dig a little to find some decent tutorials, the actual PaperVision site is very minimalist, and the documentation is practically non-existent. But despite these drawbacks, the engine has proven fairly easy to use. The model loaders in particular are very easy to get up and running. I'll have to work with it some more tomorrow, but so far its looking like PaperVision might be the winner.
Thankfully enough, a lot of the leg work I had already done can be reapplied to a different API. The functionality that I had developed for the original version had already been separated out into its own Actionscript class. Plugging a new rendering API into the program isn't too difficult.
Reading what you were saying about interface earlier I would say click and drag rotation would be great. A button for load model and a button for load texture and then a selection pop out menu with viewing modes(as you were talking about). would that be possible? or would people have to edit source code in order to display their model?
Not many people will use it if it requires to install another plugin for 3dsmax, maya or whatever authoring tool is used to display it on the web. So maybe have a look for that as well.
Holy crap! I've seen that guys site before. If any polycounter's haven't seen Roxik's work, you should. The guy has done some really spectacular things with 3D in Flash. I'm talking jaw-dropping.
As to having the ability to change up models, that may actually be possible. It would definitely be a feature that I would want to add later, and possibly only in a different version of the player. At that point the model viewer would be as general-purpose as possible, but that isn't really the intent of the project. I want this to be a player that the user can customize for displaying particualr models.
The current version of the player is able to load external models without recompiling the source code in any way. The paths for the models and textures are loaded via a javascript call in the HTML.
I agree heartily. I don't think Collada is an especially obscure format, but it's true that it's non-standard for most major 3D packages. Making it easier to view your models is the intent of the player, and its format support should reflect that. That is why I am leaning toward Papervision at the moment. It supports several common formats that Sandy 3D lacks. The current stable version of Sandy only supports three formats, 3DS, ASE, and DAE. 3DS is a common format, but its particular to 3D Studio Max, and several major programs don't support it out of the box. Ditto for ASE files. Collada's DAE format is good, but not a standard for any program.
But alas, I am not nearly that clever. (yet) So I am slave to the work of others in continuing this project. And unfortunately, I've found that my little journey has brought me full circle. Away3D and Papervision3D are both great 3D implementations for flash. But neither of them is designed to do what I've been trying to do. The material assignment systems for those APIs are seriously screwed up.
For most imported models in those systems, material attributes have to be assigned when the model is loaded, and can't be changed afterwards. One of the things that I absolutely wanted was to provide the user with the ability to change the rendering of the model on the fly. I wanted them to be able to switch from textured, to wireframed, to a combination of both, and then turn the lighting on and off. With the way Away3D and Papervision both handle model importing, that isn't going to be possible. So its once again back to Sandy3D.
I have made some progress though. I've broken my application out into multiple classes. This is helping considerably with the logic flow. Now I have a 3D scene class that handles all of the model and texture loading and the 3D scene setup. Interactivity will be assigned and controlled from the base class, while rendering will be handled in the 3D scene class. And I've even started on the interactivity. I now have it to where you can zoom in and out from the imported model by way of the mouse scroll wheel.
I've already learned a lot from this, so I don't consider the time spent in research futile. I've already got all kinds of ideas for my next 3D flash project. But I am determined to finish this project first. I won't start anything else until this one reaches version 1.0.