Question

我试图将一个JS图表放在<div>中，但问题是当我把它放在div标签内时，没有任何显示！

我尝试过使用不同的库（C3，AmCharts，HighCharts），所有这些都是同一个问题，在调用另一个div中的图表div时没有出现任何内容： / p>

<div id="chartdiv"></div>

以下内容不起作用：

<div class="block"><div id="chartdiv"></div></div>

但是，当它放在div标签之外时，它可以工作。我试过调试，但控制台上没有显示错误！

街区类的CSS：

.block {
display: block;
width: 98%;
margin-right: auto;
margin-left: auto;
padding-top: 6px;
padding-bottom: 0px;
border: 1px solid #e2e2e2;
border-radius: 4px;
background-color: #fff;
box-shadow: 0 1px 0 0 hsla(0, 0%, 91%, .75);
}

页面上有5个图表，我相信会发生导致此问题的JavaScript冲突。

有关正在发生的事情的任何想法？我不确定图书馆本身是否存在问题;但是，如果您有图表库并且能够显示实时数据，请分享。

Answer 1

尝试添加一些明确的CSS规则 - 您的HTML可能会继承意外的内容：

.block {
    width: 98%;
    margin-right: auto;
    margin-left: auto;
    padding-top: 6px;
    padding-bottom: 0px;
    border: 1px solid #e2e2e2;
    border-radius: 4px;
    background-color: #fff;
    box-shadow: 0 1px 0 0 hsla(0, 0%, 91%, .75);

    /* Sure you don't want inline-block here? */
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

JavaScript - 图表不显示在div标签内的时间

1 个答案: