0

我有一个使用 Dev Express Dev Extreme dx.charts.js 库动态构建的仪表板页面。我已经在网站中实现了 Bootstrap 3，一切都很好......直到我尝试在 iPad 上查看。我花了无数个小时来更改我的布局，但似乎没有任何帮助。这是当前代码：

<div style="display:none;" id="maindashboard">
    <div class="container" >
        <div class="row" >
            <div class="col-lg-6 col-md-6 col-sm-6" > <%-- left half column --%>
                <h1><strong>Container Levels</strong></h1>
                <div class="col-lg-6 col-md-6 col-sm-6" id="GuageColumn1"></div>
                <div class="col-lg-6 col-md-6 col-sm-6" id="GuageColumn2"></div>
            </div>
            <div id="PieCharts" class="col-lg-6 col-md-6 col-sm-6" > <%-- right half column --%>
                <div class="col-lg-6 col-md-6 col-sm-6" id="pie0" style="height:250px;" ></div>
                <div class="col-lg-6 col-md-6 col-sm-6" id="pie1" style="height:250px;" ></div>
                <div class="col-lg-6 col-md-6 col-sm-6" id="pie2" style="height:250px;" ></div>
                <div class="col-lg-6 col-md-6 col-sm-6" id="pie3" style="height:250px;" ></div>
            </div>
            <%--<div id="PieCharts" class="col-md-8 col-sm-6" >
            </div>--%>
        </div>
    </div>
</div>

当我使用 IE、ChromE、Safari 或 Firefox 在 PC 上查看仪表板时，它按预期显示，显示饼图图例。但是，当我尝试使用 Safari 或 Chrome 在 iPad 上查看页面时，不会显示图例。我已经检查了来自 PC 和 iPad 的页面源，iPad 版本的唯一区别是有一堆 webkit 属性已添加到图例图表的标记中。图表的所有数据都在标记中。通过大量测试，我注意到如果我向“pie0”对象添加引导列宽，它不会显示在 iPad 上。但是，如果我删除列宽属性，布局看起来很糟糕。我不知道我在这里错过了什么。

在此先感谢您的帮助...

4

0 回答 0