我遇到了一个问题，我使用 chart.js 的图表直到我在标签按钮上点击 3 次才出现
Posted
技术标签:
【中文标题】我遇到了一个问题，我使用 chart.js 的图表直到我在标签按钮上点击 3 次才出现【英文标题】：I am getting an issue my chart using chart.js is not appering until i tap 3 time on label button 【发布时间】：2020-07-29 16:12:53 【问题描述】：this is my canvas
this is my js function for obtaining label values this is my chart.js function
【问题讨论】：
请阅读How to Ask和minimal reproducible example，然后相应地编辑您的问题。与您的问题相关的代码属于您的问题以文本形式，并且格式正确。 不要显示代码图像。 【参考方案1】：看看这是否适合你：
(async function()
var url = "https://api.covid19india.org/data.json";
var response = await fetch(url);
var data = await response.json();
var barChartData =
labels: data.statewise
.filter((
state
) => state !== "Total")
.map((
state
) => state),
datasets: [
label: "Confirmed cases",
backgroundColor: "rgba(255,99,134,0.5",
borderWidth: 1,
data: data.statewise
.filter((
state
) => state !== "Total")
.map((
confirmed
) => confirmed),
, ],
;
var lineChartData =
labels: data.cases_time_series.map((
date
) => date),
datasets: [
fill: false,
label: "Confirmed cases",
backgroundColor: "rgba(255,99,134,0.5",
borderWidth: 1,
data: data.cases_time_series.map(
(
totalconfirmed
) => totalconfirmed
),
,
fill: false,
label: "Deceased",
backgroundColor: "rgba(99,255,134,0.5",
borderWidth: 1,
data: data.cases_time_series.map(
(
totaldeceased
) => totaldeceased
),
,
],
;
var ctx = document.getElementById("canvas").getContext("2d");
var ctx1 = document.getElementById("canvas1").getContext("2d");
window.myBar = new Chart(ctx,
type: "bar",
data: barChartData,
options:
responsive: true,
legend:
position: "top",
,
title:
display: true,
text: "States with most no. of cases",
,
,
);
window.myLine = new Chart(ctx1,
type: "line",
data: lineChartData,
options:
responsive: true,
legend:
position: "top",
,
title:
display: true,
text: "Number of cases/deceased over time",
,
,
);
)();canvas
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<title>COVID-19 in India</title>
</head>
<body>
<div id="container" style="width: 75%;">
<p>
<canvas id="canvas"></canvas>
</p>
<p>
<canvas id="canvas1"></canvas>
</p>
</div>
</body>
</html>【讨论】：
以上是关于我遇到了一个问题，我使用 chart.js 的图表直到我在标签按钮上点击 3 次才出现的主要内容，如果未能解决你的问题，请参考以下文章