我用'时间'的xAxes tipe制作了散点图。由于它是'时间'X gridLines停止附加到图表。我正在使用平移附加组件,因此我可以拖动图表,当每次拖动图表时网格线都会跳过时,它看起来很奇怪。
我想2017年5月1日还在这里。而不是出现新的gridLines。
我看起来像......
gridLines: {
positionFixed: true;
}
这是图表:
//CREATING DATE
function newDate(days){
return moment().add(days, 'd');
}
//VARIABLES TO CHANGE X SCALE (month/week/day)
var xAxisTimeMin = newDate(0);
var xAxisTimeMax = newDate(30);
//CREATING CHART
function ChartDraw(){
const CHART = document.getElementById("lineChart");
//creating data fot scatter chart
var scatterData = {
datasets:[{
label: "uuuu",
data:[
{
x: newDate(0),
y: 1409
},
{
x: newDate(1),
y: 1400
},
{
x: newDate(2),
y: 1405
},
{
x: newDate(3),
y: 1415
},
{
x: newDate(4),
y: 1460
},
{
x: newDate(5),
y: 1420
},
{
x: newDate(6),
y: 1470
},
{
x: newDate(7),
y: 1530
},
{
x: newDate(8),
y: 1420
},
{
x: newDate(9),
y: 1400
},
{
x: newDate(10),
y: 1405
},
{
x: newDate(11),
y: 1409
},
{
x: newDate(12),
y: 1401
},
{
x: newDate(13),
y: 1408
},
{
x: newDate(14),
y: 1402
},
{
x: newDate(16),
y: 1409
},
{
x: newDate(17),
y: 1402
}
],
borderColor: "rgba(255,255,255,.7)",
fill: true,
backgroundColor: "rgba(0,0,0,.3)",
}
]
};
myChart = new Chart.Scatter(CHART, {
type: 'line',
data: scatterData,
options: {
tooltips: tooltips,
scales: {
xAxes: [{
type: 'time',
time: {
displayFormats:{
},
min: xAxisTimeMin,
max: xAxisTimeMax,
},
gridLines: {
color: "rgba(255, 255, 255, 0.5)",
drawBorder: false,
lineWidth: 1,
zeroLineWidth: 1,
zeroLineColor: "rgba(255,255,255,0.5)"
},
ticks: {
maxRotation: 0,
}
}],
yAxes: [{
gridLines: {
color: "rgba(255, 255, 255, 0.5)",
drawBorder: false,
lineWidth: 1,
},
ticks:{
padding: 10,
min: 1300,
max: 1600,
}
}]
},
pan:{
enabled: true,
mode: 'x',
limits: {
min: 0,
}
},
zoom:{
enabled: false,
}
}
});
}
提前致谢。