Я пытаюсь нарисовать линейную диаграмму, которая должна отображать линию частично сплошную и частично пунктирную (для представления реальных и ожидаемых данных). Я нашел этот пример, который прекрасно работает на версии 2.0.0-альфаChart.js: линейная диаграмма с частичной пунктирной линией
var lineChartData = {
labels: ['A', 'B', 'C', 'D', 'E', 'F', 'G'],
datasets: [{
label: "My First dataset",
data: [1, 8, 3, 4, 2, 3, 4],
borderColor: '#66f',
borderDash: [20, 30],
pointBackgroundColor: "transparent"
},{
label: "My First dataset",
data: [1, 8, 3, 4, 2, , ],
borderColor: '#66f',
pointBackgroundColor: "transparent"
}]
};
var ctx = document.getElementById("chart").getContext("2d");
var myChart = new Chart(ctx, {
type: "line",
data: lineChartData,
options: {
elements: {
line: {
fill: false
}
}
}
});
<script src="https://rawgit.com/nnnick/Chart.js/f3eb6f4a433b4f34a582842dcf7b42f710861a7d/Chart.js"></script>
<canvas id="chart"/>
Но когда я запускаю тот же код с текущей версии 2.1.3 линии не перекрываются правильно (между точками D и E):
var lineChartData = {
labels: ['A', 'B', 'C', 'D', 'E', 'F', 'G'],
datasets: [{
label: "My First dataset",
data: [1, 8, 3, 4, 2, 3, 4],
borderColor: '#66f',
borderDash: [20, 30],
pointBackgroundColor: "transparent"
},{
label: "My First dataset",
data: [1, 8, 3, 4, 2, , ],
borderColor: '#66f',
pointBackgroundColor: "transparent"
}]
};
var ctx = document.getElementById("chart").getContext("2d");
var myChart = new Chart(ctx, {
type: "line",
data: lineChartData,
options: {
elements: {
line: {
fill: false
}
}
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.3/Chart.js"></script>
<canvas id="chart"/>
К сожалению, я не могу использовать альфа-версию из-за других ошибок, которые разрешены в текущей версии. Любой способ репликации графика в первом фрагменте с версией выпуска?
что, если вы добавите все данные, чтобы пунктирные к ... – vaso123
@lolka_bolka пунктирной линии уже имеют все точки данных, но это не правильно пересекаться и вы можете увидеть его часть позади сплошная линия –