Google Chart отображается неправильно на вкладке, пока я не изменю размер окна - PullRequest
0 голосов
/ 22 ноября 2018

Когда я нажимаю на вкладку с Google Chart, сначала она отображается маленьким, а стиль ширины не применяется:

Google Chart is not showing properly

Но когда я изменяю размерокно «прыгает» так, как должно выглядеть:

Correct way to be

Я хотел бы увидеть его с самого начала, так как оно масштабируется на втором изображении,Вот одна вещь, которую я заметил: после того, как он «перескакивает» в правильный формат, если я перехожу на предыдущую вкладку и даже немного изменяю размер окна, когда я нажимаю на вкладку «Макросы», она снова становится маленькой.

Это код:

<script src="https://rawgit.com/louisremi/jquery-smartresize/master/jquery.throttledresize.js"></script>
<script src="https://www.google.com/jsapi?fake=.js"></script>
<script>
    $(window).on("throttledresize", function (event) {
        var options = {
            width: '100%',
            height: '100%'
        };

        var data = google.visualization.arrayToDataTable([]);
        drawChart(data, options);
    });
</script>

CSS из заголовка:

<style>
    #chart_wrap {
        position: relative;
        padding-bottom: 100%;
        height: 0;
        overflow:hidden;
    }

    #piechart {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
</style>

И HTML-код - я использую Semantic UI:

<div class="ui tab segment" data-tab="macros">

        <div id="chart_wrap">
            <div id="piechart"></div>
        </div>

</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...