[x3d-public] [x3dom-users] resize x3d area

[Andreas Plesch]

https://jsitor.com/XcBZURCAh has a simple scene with regular html.

I also updated https://observablehq.com/@andreasplesch/x3dom-inline-resizing-and-switching-without-reloading
to explain a bit better how the styling works.

Hope this helps, -Andreas

On Mon, Jan 6, 2020 at 9:47 AM Jesse Campbell <emsjessec at gmail.com> wrote:
>
> Wow.  Very impressive.  Is there a way I can view the Javascript / HTML source?
>
> On Sat, Jan 4, 2020 at 12:40 AM Andreas Plesch <andreasplesch at gmail.com> wrote:
>>
>> This may be more of a css question.
>>
>> Since observable is fun:
>>
>> https://observablehq.com/@andreasplesch/x3dom-inline-resizing-and-switching-without-reloading
>>
>>
>>
>>
>> On Fri, Jan 3, 2020 at 3:44 PM Jesse Campbell <emsjessec at gmail.com> wrote:
>> >
>> > Thanks, I was thinking something like the triangle on the lower right of a div or iframe:  https://jsfiddle.net/bpue7q9L/
>> >
>> >
>> >
>> >
>> >
>> > On Fri, Jan 3, 2020 at 3:13 PM Andreas Plesch <andreasplesch at gmail.com> wrote:
>> >>
>> >> You can style the width and height of the webgl canvas which x3dom
>> >> creates. One way to access the canvas is by
>> >> x3delement.runtime.getCanvas().
>> >>
>> >> canvas.style.width='200px';
>> >>
>> >> It may or may not be necessary to keep the height and width of the x3d
>> >> element itself in sync.
>> >>
>> >> https://doc.x3dom.org/tutorials/animationInteraction/transformations/example.html
>> >>
>> >> is a fullscreen example which adjusts to the window size.
>> >>
>> >> On Fri, Jan 3, 2020 at 1:36 PM Jesse Campbell <emsjessec at gmail.com> wrote:
>> >> >
>> >> > Thanks again,
>> >> >
>> >> > Here's a preview of what I'm building: https://i.imgur.com/mmiwwwp.png
>> >> >
>> >> > Do you have any examples that allow the 3d Model and canvas to be resized?  Right now it's locked at 800 x 600 unless the code is modified and the page reloaded.
>> >> >
>> >> > On Fri, Jan 3, 2020 at 12:00 PM Andreas Plesch <andreasplesch at gmail.com> wrote:
>> >> >>
>> >> >> Yes, there are. You will need to use a namespacename attribute for the
>> >> >> Inline. This will trigger appending the Inline to the DOM, as child of
>> >> >> the Inline node. Here are examples:
>> >> >>
>> >> >> https://examples.x3dom.org/example/x3dom_inlineReflection.xhtml
>> >> >> https://raw.githack.com/x3dom/x3dom/dd69edb188fa3142e1233c1a2244a7f4973200f5/test/regression-suite/test/cases/inlineEvents/inlineEvents.html
>> >> >>
>> >> >> On Fri, Jan 3, 2020 at 11:34 AM Jesse Campbell <emsjessec at gmail.com> wrote:
>> >> >> >
>> >> >> > Is there an example of changing the color of an inlined model using Javascript?
>> >> >> >
>> >> >> > I can edit this XML tag and reload the page and that works.  However, I want the color to change without reloading the page.
>> >> >> >
>> >> >> > <Material id='color' diffuseColor='0.292 0.82 0.933' specularColor='.2 .2 .2'>
>> >> >> >
>> >> >> > This is a test 3D Model in X3D format: https://pastebin.com/iXquMi9h
>> >> >> >
>> >> >> > --
>> >> >> > Jesse Campbell
>> >> >> >
>> >> >> > _______________________________________________
>> >> >> > X3dom-users mailing list
>> >> >> > X3dom-users at lists.sourceforge.net
>> >> >> > https://lists.sourceforge.net/lists/listinfo/x3dom-users
>> >> >>
>> >> >>
>> >> >>
>> >> >> --
>> >> >> Andreas Plesch
>> >> >> Waltham, MA 02453
>> >> >
>> >> >
>> >> >
>> >> > --
>> >> > Jesse Campbell
>> >> > Web Developer
>> >> > eMachineShop & Pad2Pad
>> >> >
>> >>
>> >>
>> >> --
>> >> Andreas Plesch
>> >> Waltham, MA 02453
>> >
>> >
>> >
>> > --
>> > Jesse Campbell
>> > Web Developer
>> > eMachineShop & Pad2Pad
>> >
>>
>>
>> --
>> Andreas Plesch
>> Waltham, MA 02453
>
>
>
> --
> Jesse Campbell
> Web Developer
> eMachineShop & Pad2Pad
>


-- 
Andreas Plesch
Waltham, MA 02453