I'm sure this has probably been asked before, but I'm fairly new to threejs (and React Fiber), so part of my problem here is not really knowing how to phrase what I need..
I know what I want to do must be possible, because it is possible to drag and drop any gltf file here: https://gltf-viewer.donmccurdy.com/ and see it rendered correctly.
So, what I want to do, is create a loop which will traverse all parts (nodes?) of a gltf model with/without animations (such as this one) and output it as part of a webpage.
Currently, I find myself tediously trying to add a <mesh> for each and every part of a model, and I know there must be an easier way.
I have found the source-code for the viewer here, but as mentioned, I'm still quite new to this library, so any help (or link to a similar question), would be appreciated.
Related
I would like to render DOM elements (which im otherwise using React for) onto (for example) a plane in a 3D (WebGL -> Three.js -> Three Fiber (??? so far best way to go about it as im figuring?)) environment.
So basically Id have my containing my entire app lets say rendered, as is traditional, into "root" element. Except I want to inject a layer in that utilizes Three Fiber to render and everything I might want my site (or even just a particular component) to contain onto this plane. Allowing one to make a react site as normal and behind the scenes (probably in index.js or intermediate file) would instead of being rendered "flat" against the screen i could "tilt" the entire site, give it opacity, maybe have multiple webpages all able to be shuffled like cards, sides of a dice, w/e tf.
If anybody has any suggestions im struggling with how one could go about this.
Im worried i might have to get kind of low-level (which im not totally against), but was hopeful there was some support for something of this nature. So far ive tried even having simple elements like an image element inside a material (element - via three fiber) or inside the mesh element (where the material would go) to no avail. Im just beginning to get my hands dirty but google hasnt availed me much for this project, so I turned to good ol' stack overflow for my first personal request! 🤯 😲 👹 !
Thanks in advance so much for your time and consideration - cheers,
John Thummel
this is possible using drei/Html. some impressions:
https://twitter.com/0xca0a/status/1398633764931178498
https://twitter.com/0xca0a/status/1407758860203573251
I'm currently working on a flutter application. I have a file with a big widget tree. In order to easier understand, read and maintain I wanted to "crop" the widget tree.
First what I did was to create multiple functions, which represented a bigger part of the tree such as _createFancyImage() or _createFancyContainer. After some research, I found out that such a design has some downsides (see: https://github.com/flutter/flutter/issues/19269). So then I decided to create StatelessWidgets instead. Because of the huge size of the widget tree, I broke it down to 3 logical StatelessWidgets. Now I can use FancyImage() or FancyContainer() which represent each a standalone widget.
As a beginner, I'm not sure whether I should keep those StatelessWidgetclasses within the same file. Alternatively, I could create independent files. One thing to clarify: I'm not using those fancy widgets somewhere else. Those are unique to this one big widget tree otherwise I could have outsourced them into a new folder such as "common_widgets" or "components".
Unfortunately, I couldn't find something within the Dart and Flutter Repo style guides nor on the internet.
I appreciate every suggestion.
You can add as much classes as you need in a single file. It depends on the developer's mindset.
But, let say if one of your class can be reused by other classes or packages then you should add it to another file for better separation.
I can favour you one approach is that your each file should have maximum one Stateful widget and as many Stateless widgets as you want for that corresponding widget will be a better scenario.
Still in some cases if you feel that more than enough stateless widgets has been added in a single file you should separate it in another file based on your choice.
I prefer to keep one public widget which having the same name as the filename and remaining private widgets.
comming to your ques is How many widgets in a single file?
Its actually depend there is no such rule to restrict the limit of file. Different authors having different preference. I prefer try to keep 5-6 classes(widgets) and
each one having 5-6 functions.
Try to make a file single responsible i.e(5-6 classes together responsible for single functionality). Don't make god class which having unrelated concerns together later it will pains(haha)
If it's a common widget keep them separate to respect DRY principle(Don't repeat yourself)
If the widget is further divided into 3-4 widgets or it children widget change depend upon rest response keep seprate for good practise
Bonus Tip: try using code folding shortcuts to push a little more
I am new to angular 2/4,and I am trying to use ng2-admin as a base, and trying to build on to of it a full dash board includes beck-end.
I am facing lots of issues while trying to use exist component(such as basic table) in a new simple module. I can't find any detailed documentation on ng2-admin beside creating new page.
Is there anyone who can guide me please?
Thanks
Never mind, i found the solution 😀
what actually i did was to redefine the Declarations/Providers correctly.
when using "ng" to generate new things,it is also adding unnecessary deceleration in some places so this was my first mistake,also some used providers/services was needed to be declared on the right module.after understanding how the structure should be ,i kept the rules and i was able to add what i needed without any issues.
I'm trying to look through and find a way to annotate a video in C with polygons bounding boxes, however I'm stuck at a very elementary step.
Assuming I know how to break a .MPEG movie up into multiple JPEG images, how do I manipulate that file in C? The things I'll eventually need to draw on are text, points, and lines, but I am having a hard time figuring out how to get started with this.
If I declare:
FILE* img = fopen('foo.jpeg', 'r');
then what could I do with img? Is there a way to access certain pixels in the drawing?
What you did in your code sample is just opening a file. You didn't even read any data from it yet.
The simplest way to load an image file is to use dedicated library, such as SOIL.
If you weren't able to do it by yourself, however, I really don't think you will be able to accomplish your project goals - it is really advanced stuff you want to create, and you failed, as you already noticed, on the most basic of steps.
Ui:include and xhtml based tag (the one with source elt) seem to be much the same for me. Both allow to reuse piece of markup. But I believe there should be some reason for having each. Could somebody please briefly explain it? (I guess if I read full facelets tutorial I will learn it, but I have not time to do it now, so no links to lengthy docs please :)
They are quite similar. The difference is mainly syntactical.
After observing their usage for some time it seems the convention is that fragments that you use only in a single situation are candidates for ui:include, while fragments that you re-use more often and have a more independent semantic are candidates for a custom tag.
E.g.
A single view might have a form with three sections; personal data, work history, preferences. If the page becomes unwieldy, you can divide it into smaller parts. Each of the 3 sections could be moved to their own Facelet file and will then be ui-include'ed into the original file.
On the other hand, you might have a specific way to display on image on many views in your application. Maybe you draw a line around it, have some text beneath it etc. Instead of repeating this over and over again you can abstract this to its own Facelet file again. Although you could ui:include it, most people seem to prefer to create a tag here, so you can use e.g. <my:image src="..." /> on your Facelets. This just looks nicer (more compact, more inline with other components).
In the Facelets version that's bundled with JSF 2.0, simple tags can be replaced by composite components. This is yet a third variant that on the first glance looks a lot like custom tags, but these things are technically different as they aren't merely an include but represent true components with declared attributes, ability to attach validators to, etc.