图表js未在移动设备上绘制（safari/chrome）桌面上绘制
我有一个在桌面上运行得非常好的piechart。它从AJAX请求中检索数据，并存储它获得的数据/json。然后将选定的数据推送到图表中。我用的是百里香
当我在手机上通过Safari或chrome访问我的页面时，页面上的所有内容都显示得很好，但是图形不存在。
我尝试过改变响应true/false，维护A265 Ratio false/true，玩chart.js留档中提供的其他选项。改变了视口，在画布的容器上设置了我的宽度，而不是画布本身和一大堆其他东西。
会不会是装货单的原因？也就是说，页面在实际从请求中获取信息之前被加载？然而，这意味着它也不应该在桌面上工作。
这里有一些代码
我的图表。js
$(document).ready(function () {
var id = $.url(2);
$.ajax({
url: "hosturl/a/b/" + id + "/c/d",
type: "GET",
dataType: "json",
success: function (data) {
console.log(data);
var count = [];
var days = [];
for (var i in data) {
days.push(data[i][1]);
count.push(data[i][0]);
}
var chartdata = {
labels: days,
datasets: [
{
label: "By day",
backgroundColor: "#4dc3ff",
borderWidth: 2,
hoverBackgroundColor: "#009",
hoverBorderColor: "#099",
hoverBorderWidth: 5,
data: count
}
]
};
var ctx = $("#daysGraph");
var pieChart = new Chart(ctx, {
type: 'pie',
data: chartdata,
options: {
responsive: true,
legend: {
display: true,
position: 'right',
labels: {
fontColor: "#000"
}
}
}
});
},
error: function (data) {
}
});
图表html（大多数其他html都被删掉了，但这本身不起作用）
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-
scale=1,maximum-scale=7"/>
<title>Hmm</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"/>
<script src="../../javascript/Chart.min.js" th:href="@{/Chart.min.js}"/>
<script src="../../javascript/js-url-2.5.0/url.js" th:href="@{/url.js}" ></script >
<link rel="stylesheet" href="../static/css/graph.css" th:href="@{/css/graph.css}"/>
<script src="../../javascript/myGraph.js" th:href="@{/myGraph.js}" />
</head>
<body>
<div class="chart-container">
<canvas id="daysGraph" ></canvas>
</div>
</body>
</html>
graph.css
.chart-container {
position: relative;
margin: auto;
height: 80vh;
width: 80vw;
}
在实时服务器上，它看起来像这样
欢迎任何意见
共有2个答案
我自己也遇到过类似的问题，我通过使用borderWidth解决了我的问题，以便让它在所有设备上都能正常工作。试着改变它几次，看看它是否有任何影响。
事实证明，mobile和dektop上与localhost相关的api路由有问题。因此，我的数据不是从api获取的，因此不会填充图表，这就是为什么它不会显示在手机上。换句话说，我在错误的地方寻找答案。
-
问题内容： 在移动设备上时，是否可以将引导网站显示为桌面版本？ 基本上，页面将显示992px或1200px视口，而不是小型设备。 例如，BBC允许您使用页面底部的链接在移动网站和桌面网站之间进行切换，这就是我想做的。 谢谢 问题答案： 您只需要设置视口 像您说的那样建立一个链接，该链接是页面的重新加载，但带有，则可以设置会话，只要设置了该会话，就可以编写 代替此（响应版本） 在你的 将此用作按钮
-
问题内容： 关闭。 此问题不符合堆栈溢出准则。它当前不接受答案。 想改善这个问题吗？ 更新问题，使其成为Stack Overflow 的主题。 6年前关闭。 改善这个问题 我想用Java绘制图形（节点和边）。但是，由于我不知道该怎么做，因此在开始之前我想寻求一些建议。 我应该怎么做？ 使用Graphics2D包，对吗？ 节点的标签怎么样？我应该使用诸如drawString之类的东西并手动处理所有“
-
我现在正在做一个游戏，遇到了一些我想不出来的事情。我有一系列的ImageButton，我正在迭代，并在每个按钮上绘制位图。位图本身绘制得很好，但是我也想在这些位图上绘制矩形。 相关代码（如果这还不够，我可以发布更多）： 位图本身出现在按钮上，但是我想要绘制的矩形没有被绘制。
-
问题内容： 我无法在JFrame上绘制此椭圆形。 框架显示，但其中未绘制任何内容。我在这里做错了什么？ 问题答案： 您创建了一个静态方法，该方法不会覆盖paint方法。现在，其他人已经指出，您需要覆盖paintComponent等。但是，为了快速修复，您需要执行以下操作： 但是，正如其他人指出的那样，在JFrame上进行绘制非常棘手。最好使用JPanel。
-
我该怎么做才能在我自己的视图上使用freehanf手指画？
-
我的makeWhiteTransparent方法如下所示： 我尝试将graphics.drawImage(newImage，null，0，0)更改为graphics.drawImage(newImage，0，0，null)，并按照建议将TYPE_4BYTE_ABGR更改为TYPE_INT_ARGB，但没有任何效果。错误仍然存在。