The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> How to embed 3D files on my html pages?
calmabubbasst
post Oct 23 2023, 04:08 AM
Post #1


Member
***

Group: Members
Posts: 45
Joined: 20-July 22
Member No.: 28,449



Hi folks,
here I am again with my strange questions,
today I would like to insert 3D models into my html pages.

I've read several pages and seen several solutions, but each one gives me complex problems or doesn't work at all.

With this code I can view the "Deer.x3d" file (the sample file found with the code) but I can't see my "h146.x3d" test file ...

Could you tell me why I can't just copy the code and replace my 3D model with deer.x3d?

Can you suggest me another method to embed my 3d file into an html page?


CODE

<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <title>My first X3DOM page</title>
    <script type='text/javascript' src='https://www.x3dom.org/download/x3dom.js'> </script>


</head>
<body>
<h1>Using the Inline Node</h1>

<p>
    This example includes an external x3d scene. You can even manipulate its content during runtime.
</p>
<x3d width='500px' height='500px'>
    <scene>
            <viewpoint position="-1.9 1.7 -2.8" orientation="0.04 0.9 0.1 3.7"></viewpoint>
            <Inline nameSpaceName="Deer" mapDEFToID="true"
                    onclick='redNose();' url="https://doc.x3dom.org/tutorials/models/inline/Deer.x3d" />
    </scene>
</x3d>

<p>
    This example includes an external x3d scene. You can even manipulate its content during runtime.
</p>
<x3d width='500px' height='500px'>
    <scene>
            <viewpoint position="-1.9 1.7 -2.8" orientation="0.04 0.9 0.1 3.7"></viewpoint>
            <Inline nameSpaceName="De5er" mapDEFToID="true"
                    url="http://www.nastri-trasportatori.com/3D/h146.x3d" />
    </scene>
</x3d>

</body>
</html>


IPB Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
coothead
post Oct 23 2023, 09:58 AM
Post #2


Advanced Member
****

Group: Members
Posts: 206
Joined: 12-January 23
From: chertsey, a small town 25 miles south west of london, england
Member No.: 28,743



QUOTE(calmabubbasst @ Oct 23 2023, 10:08 AM) *

...I can't see my "h146.x3d" test file


the link to your h146.x3d file gives ...

HTTP Error 404.3 - Not Found

As a test, I uploaded the Deer.x3d to my website and it worked OK.


coothead

This post has been edited by coothead: Oct 23 2023, 10:12 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
calmabubbasst
post Oct 23 2023, 11:13 AM
Post #3


Member
***

Group: Members
Posts: 45
Joined: 20-July 22
Member No.: 28,449



QUOTE(coothead @ Oct 23 2023, 09:58 AM) *

QUOTE(calmabubbasst @ Oct 23 2023, 10:08 AM) *

...I can't see my "h146.x3d" test file


the link to your h146.x3d file gives ...

HTTP Error 404.3 - Not Found

As a test, I uploaded the Deer.x3d to my website and it worked OK.


coothead


Hi man, i've got same error but the file exist from sept 8th .... whatsapp?? sad.gif

IPB Image

(...edit) ehi ... ? what the ..?? NO DEER too???? 8|
IPB Image

Whats append????

This post has been edited by calmabubbasst: Oct 23 2023, 11:39 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
calmabubbasst
post Oct 24 2023, 05:31 AM
Post #4


Member
***

Group: Members
Posts: 45
Joined: 20-July 22
Member No.: 28,449



.. i've find also this : https://modelviewer.dev/
very good very fine ..

I've copied/download all the entire website and put here: www.nastri-trasportatori.com/3dmd/index.html
but i cant see no one 3d model ... sad.gif

what makes me sad is that if I go here https://www.nastri-trasportatori.com/3dmd/editor/index.html and I drag or upload "NeilArmstrong.glb" I'll see correctly the 3d model ...
(3d model that you can find here nastri-trasportatori.com/3dmd/shared-assets/models/NeilArmstrong.glb instead "HTTP Error 404.3 - Not Found" message)
(her you can download the same models https://nastri-trasportatori.com/3dmd/share...l-3d-models.zip 11.4mb)

.... sad.gif sob ...

Can anyone help me understand something?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
coothead
post Oct 24 2023, 10:07 AM
Post #5


Advanced Member
****

Group: Members
Posts: 206
Joined: 12-January 23
From: chertsey, a small town 25 miles south west of london, england
Member No.: 28,743



QUOTE(calmabubbasst @ Oct 24 2023, 11:31 AM) *

. I've copied/download all the entire website and put here:

. https//www.nastri-trasportatori.com/3dmd/index.html

. but i cant see no one 3d model ... sad.gif



You probably did not edit the code fully. IPB Image

Try this one, instead...

Attached File  model_viewer.html ( 8.93k ) Number of downloads: 49


...it works OK for me. IPB Image

coothead

This post has been edited by coothead: Oct 24 2023, 10:22 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
coothead
post Oct 24 2023, 10:33 AM
Post #6


Advanced Member
****

Group: Members
Posts: 206
Joined: 12-January 23
From: chertsey, a small town 25 miles south west of london, england
Member No.: 28,743



Hi there calmabubbasst,

if you are mildly interested, these are the reported errors for you page...

QUOTE

Loading failed for the <script> with source “https://www.nastri-trasportatori.com/www.google-analytics.com/analytics.js”. index.html:48:63
Loading failed for the <script> with source “https://www.nastri-trasportatori.com/web3dsurvey.com/collector.js”. index.html:40:54

Source map error: Error: request failed with status 404
Resource URL: https://www.nastri-trasportatori.com/3dmd/n...l-viewer.min.js
Source Map URL: model-viewer.min.js.map



coothead
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
calmabubbasst
post Oct 26 2023, 04:10 AM
Post #7


Member
***

Group: Members
Posts: 45
Joined: 20-July 22
Member No.: 28,449



QUOTE(coothead @ Oct 24 2023, 10:33 AM) *

Hi there calmabubbasst,

if you are mildly interested, these are the reported errors for you page...

QUOTE

Loading failed for the <script> with source “https://www.nastri-trasportatori.com/www.google-analytics.com/analytics.js”. index.html:48:63
Loading failed for the <script> with source “https://www.nastri-trasportatori.com/web3dsurvey.com/collector.js”. index.html:40:54

Source map error: Error: request failed with status 404
Resource URL: https://www.nastri-trasportatori.com/3dmd/n...l-viewer.min.js
Source Map URL: model-viewer.min.js.map



coothead


TNX U smile.gif

I've copied your html and modify it
https://www.nastri-trasportatori.com/3dmd/test2.html
do you know why, i can see the original glb files but not mine (B/C) glb files?

Also could you tell me how to "erase/clear" the (A) pages zone?
IPB Image

This post has been edited by calmabubbasst: Oct 26 2023, 04:15 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
coothead
post Oct 26 2023, 04:43 AM
Post #8


Advanced Member
****

Group: Members
Posts: 206
Joined: 12-January 23
From: chertsey, a small town 25 miles south west of london, england
Member No.: 28,743



QUOTE(calmabubbasst @ Oct 26 2023, 10:10 AM) *


Also could you tell me how to "erase/clear" the (A) pages zone?



Yes, I can do that.IPB Image

Change this code...
CODE

<style>
.demo model-viewer {
   background-color: #fff;
}
</style>

...to this...
CODE

<style>
.demo model-viewer {
   background-color: #fff;
}
.slogan, pre {
   display: none;
}
</style>



coothead
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
calmabubbasst
post Oct 27 2023, 01:13 PM
Post #9


Member
***

Group: Members
Posts: 45
Joined: 20-July 22
Member No.: 28,449



Ok ... tnx you, i do 1 more step
https://www.nastri-trasportatori.com/3dmd/test3.html

but ... i dont want to stay in the right side but i wanna have my 4 glb files spread across the entire page without leaving empty areas

How i can reach it?

And more importantly, I don't understand why my 3D files aren't showing while the others work? (I tried and even in Windows Explorer you can see my 3Ds clearly)

Why can't they be seen online? sad.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
coothead
post Oct 27 2023, 04:46 PM
Post #10


Advanced Member
****

Group: Members
Posts: 206
Joined: 12-January 23
From: chertsey, a small town 25 miles south west of london, england
Member No.: 28,743



QUOTE(calmabubbasst @ Oct 27 2023, 07:13 PM) *


I want to have my 4 glb files spread across the entire page without leaving empty areas



Try this...
Attached File  test3.html ( 2.83k ) Number of downloads: 53


QUOTE


I don't understand why my 3D files aren't showing while the others work?



I cannot say from where I'm standing. IPB Image

You will have to check your coding for them, as it is probably flawed. IPB Image

coothead
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
calmabubbasst
post Oct 30 2023, 10:21 AM
Post #11


Member
***

Group: Members
Posts: 45
Joined: 20-July 22
Member No.: 28,449



Hi @coothead, tnx to your help i've got this
https://www.nastri-trasportatori.com/3dmd/test33.html

instead i dont understand whats wrong to my files ... I've transleted it from .stp to .glb with online translator, so i dont know how to check coding ..

As i tell you, the strange things it's that in my win10 explorer, that files runs good ...

here my 3D files videos https://streamable.com/wzqv0d
<iframe src="https://streamable.com/e/wzqv0d" width="560" height="277" frameborder="0" allowfullscreen></iframe>

Maybe you are able to suggest me how to check coding and fix - ora how to embedd others 3D format files?

Many thanks for your support and patience smile.gif

This post has been edited by calmabubbasst: Oct 30 2023, 10:23 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 27th April 2024 - 07:18 AM