我有一个使用chart.js创建的条形图.在页面加载时一切正常,但是当我使用daterangepicker更改时间范围时,会出现毛刺.新数据被引入,但当我将鼠标悬停在它上面时,会显示旧数据.我是javascript的新手,所以我希望得到一些帮助.看起来我需要合并.destroy(); 不知何故,但我不知道如何.我的代码片段如下:
function loadFTPRChart(startdate, enddate){
var BCData = {
labels: [],
datasets: [
{
label: "Pass %",
backgroundColor: "#536A7F",
data: [],
stack: 1
},
{
label: "Fail %",
backgroundColor: "#e6e6e6",
data: [],
stack: 1
},
{
label: "Auto %",
backgroundColor: "#286090",
data: [],
stack: 2
},
{
label: "Manual %",
backgroundColor: "#f0f0f0",
data: [],
stack: 2
}
]
};
$.getJSON( "content/FTPR_AM_Graph_ajax.php", {
startdate: startdate,
enddate: enddate,
location: "M"
})
.done(function( data ) {
console.log("data", data);
$.each( data.aaData, function( key, val …Run Code Online (Sandbox Code Playgroud) 我正在使用图表Js显示条形字符。我需要使用的数据是不同的下拉列表。我的图表工作正常,除非当用户从下拉菜单中选择其他选项并且画布重新加载了新数据时,在鼠标上方的故障和画布在旧选择的数据与当前数据之间跳跃
我环顾四周以解决此问题,并发现以下方法
ChartJs在鼠标悬停时显示旧数据, 但不起作用
该代码是
<html>
<head>
<script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<style type="text/css">
#ctx{max-width: 700px;
width:700px;
height: 350px;
max-height: 350px;}
</style>
</head>
<body>
Please select : <select id="mySelect" onchange="myFunction()">
<option value="Please Select">Please Select</option>
<option value="C001"> 001
<option value="C002"> 002
<option value="C003"> 003
</select>
<p id="demo"></p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"></script>
<canvas id="ctx" ></canvas>
<script>
function myFunction() {
var x = document.getElementById("mySelect").value;
document.getElementById("demo").innerHTML = "You selected: " + x;
creatGraph(x);
}
function GetMyData(Id)
{
var data;
switch(Id) {
case "C001":// consultant 001
data = {labels: ['0 …Run Code Online (Sandbox Code Playgroud)