Как мне сделать диаграмму для значений углов? - PullRequest
0 голосов
/ 08 ноября 2018

У меня есть несколько значений угла, выраженных в градусах, минутах и ​​секундах. Я хочу показать их вместе на графике Chart.js.

Скажем, значения 1° 30' 26" и 1° 30' 25". Диаграмма должна показать, как угол стал меньше на 1".

Я думал о преобразовании значений угла в десятичные градусы:

  • 1° 30' 26" = 1° + 30'/60 + 26"/3600 = 1.507222°
  • 1° 30' 25" = 1° + 30'/60 + 25"/3600 = 1.506944°

Я сделал линейный график с десятичными градусами:

var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: ["initial value", "2016-02"],
        datasets: [{
            label: "angle",
            borderColor: 'rgb(255, 99, 132)',
            /* 1° 30' 26" = 1° + 30'/60 + 26"/3600 = 1.507222°
             * 1° 30' 25" = 1° + 30'/60 + 25"/3600 = 1.506944°
             */
            data: [1.507222, 1.506944],
            fill: false
        },
        ]
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    labels: ["1 30 26", "1 30 25"],
                    beginAtZero:false
                }
            }]
        }
    }
});
<canvas id="myChart" aria-label="Angle evolution chart" role="img"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js"></script>

Моя проблема в том, что я все еще хотел бы отображать градусы, минуты и секунды. Как на оси Y, так и на всплывающих подсказках.

  • Для оси Y, как видно из примера, я попытался установить options.scales.yAxes.ticks.labels. Кажется, не имеет никакого эффекта (возможно, я не правильно его использую).
  • Что касается подсказок, я не знаю, как бы я это сделал.

Можно ли как-то добиться того, чего я хочу, с Chart.js? Если нет, каковы мои варианты? Я полагаю, я мог бы попытаться добавить поддержку самостоятельно, но, возможно, уже есть другие библиотеки, которые делают это?

Или есть лучший способ представления значений углов?

...