我用图表 j生成了直线图表,但我必须显示其立场与缺省情况不同。
我看到了一些例子,说明如何轮用图制作的标签,但这只是对文本而不是整个图形进行操作。
目前,这是我编制图表的法典。
var dataSets = [
dt1 = {
borderColor: "#434EDA",
data: [17.28, 22.58, 27.91, 31.95, 36.32, 41.73, 45.78, 48.55, 53.48, 47.82,],
fill: false,
label: "Dataset1",
pointHitRadius: 5,
pointRadius: 5
},
dt2 = {
borderColor: "#3DE383",
data: [11.83, 20.23, 26.9, 32.39, 36.95, 41.48, 46.41, 48.82, 52.58, 49.42,],
fill: false,
label: "Dataset2",
pointHitRadius: 5,
pointRadius: 5
},
dt3 = {
borderColor: "#ec0000",
data: [14.2, 20.94, 27.36, 32.12, 36.33, 41.4, 46.58, 48.8, 52.69, 48.9,],
fill: false,
label: "Dataset3",
pointHitRadius: 5,
pointRadius: 5
}
]
var grafValues = {
labels: ["0 mts", "1 mts", "2 mts", "3 mts", "4 mts", "5 mts", "6 mts", "7 mts", "8 mts",],
datasets: dataSets,
}
var grafOptions = {
// responsive: true,
scales: {
xAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: "Depth"
},
}],
yAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: "Temperature ° C"
},
}]
},
title: {
display: true,
text: "Graphic 1"
},
legend: {
display: true,
position: top ,
labels: {
boxWidth: 40,
fontColor: black
}
},
tooltips: {
enabled: true
}
}
var ctx = document.getElementById( chart-zone ).getContext( 2d );
var lineChart = new Chart(ctx, {
type: line ,
data: grafValues,
options: grafOptions
})
<head>
<meta charset="utf-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<canvas id="chart-zone" ></canvas>
</body>
我希望有一张图像显示的轮值如下:
http://www.ohchr.org。
我在调查图表中略微多一点。
在法典这一部分适用这些选择
xAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: "Depth",
},
position: left //X-axis position change
}],
yAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: "Temperature ° C",
},
position: top //Y-axis position change
}]
但现在的问题是,由于X-轴心中的价值观不存在,这些价值观已经消失。 实现法典的修改,并将看到我的含义。
感谢您的帮助和建议。