Создание горизонтальной линии в chart.js, но не полная длина графика - PullRequest
0 голосов
/ 04 октября 2018

Мне нужно, чтобы две эти линии были на одном уровне, поэтому я не мог найти ничего, что могло бы ограничить или нарисовать горизонтальную линию над графиком.Эта линия нарисована с помощью плагина для аннотаций, но есть возможность установить длину линии.

enter image description here

Так, например, я хочу, чтобы 2 цвета былиэта строка или две строки различной длины

Код:

 const ctx = document.getElementById('chart_1').getContext('2d');

            const ch = new Chart(ctx, {
                type: 'line',
                data: {
                    datasets: [{
                        labels: names,
                        data: values,
                        borderWidth: 1,
                        fill: false,
                        borderColor: 'rgb(0, 99, 255)',
                    }],
                },
                options: {
                    scales: {
                        yAxes: [{
                            ticks: {
                                beginAtZero: true,
                            },
                        }],
                    },
                    responsive: false,
                    annotation: {
                        drawTime: 'afterDraw',
                        annotations: [{
                                          type: 'line',
                                          mode: 'horizontal',
                                          scaleID: 'y-axis-0',
                                          value: 50000,
                                          borderColor: 'rgb(75, 192, 192)',
                                          borderWidth: 20,
                                          label: {
                                              backgroundColor: 'rgba(0,0,0,0)',
                                              fontColor: '#000',
                                              enabled: true,
                                              content: 'Test label',
                                          },
                                      },
                                      {
                                          type: 'line',
                                          mode: 'horizontal',
                                          scaleID: 'y-axis-0',
                                          value: 50000,
                                          borderColor: 'red',
                                          borderWidth: 20,
                                          label: {
                                              backgroundColor: 'rgba(0,0,0,0)',
                                              fontColor: '#000',
                                              enabled: true,
                                              content: 'Test label',
                                          },
                                      },
                        ],
                    },
                },
            });

U видно, что в коде есть две строки, но красная над первой.Любая помощь приветствуется.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...