Threejs холст внутри вкладки отображает 100px х 100px не всю ширину или высоту родителя

Question

Threejs холст Iside Вкладки является displayng 100px х 100px не всю ширину или высоту родительского

Описание задачи

I есть эта проблема в течение 2 дней, я не знаю, как это исправить.

У меня есть 3 вкладки, первая вкладка активна на вкладке secont. У меня есть холст threejs и третий что-то elese.

Когда я запускаю программу, первая вкладка активна, показывает, что не показано, когда я переключаюсь на второй ответ, у меня есть трехмерное полотно, все в порядке, если проблема заключается в том, что у меня есть первая вкладка, и я максимизирую window и i после этого я переключился на второй щелчок, так как у меня есть трёхмерный холст, который имеет ширину 122 пикселей шириной 122 пикселя. idont понимаю, почему PLS, кто может мне помочь, я установил ширину моего родителя div до 100% и высоту 100%. Я дважды проверяю, что если это полная ширина и все в порядке.

если я активирую вторую вкладку, у меня есть холст, у меня нет проблем, но дело в том, что сначала не нужно отображать мой 2-х крановый вид. есть ли способ, чтобы перезагрузить холст еще раз, когда я разворачивать окно Thnx

` <div class="row"> 
<div class="col s12"> 
    <ul class="tabs"> 
    <li class="tab col s3"><a href="#test1">Test 1</a></li> 
    <li class="tab col s3"><a class="active" href="#test2">Test 2</a></li> 
    <li class="tab col s3 disabled"><a href="#test3">Disabled Tab</a></li> 
    <li class="tab col s3"><a href="#test4">Test 4</a></li> 
    </ul> 
</div> 
<div id="test1" class="col s12">Test 1</div> 
<div id="test2" class="col s12"> 
    <div id="canvas3D"></div> 
</div> 
<div id="test3" class="col s12">Test 3</div> 
<div id="test4" class="col s12">Test 4</div> 

`

jsfiddle example

Answer 1

(VW) блок на коде CSS я просто говорю родительская ширина быть

# canvas3D {

ширина: calc (100vw - 60px); высота: calc (100vh - 60px);

}

Я надеюсь, что кто-то собирается помог :)