Как создать линейный график спарклайн в угловых 4

Question

Я хочу создать спарклайн-график, который будет принимать значения массива, такие как

[{"sNo": 224, "val": 3}, {"sNo": 220, "val": 1}, {"sNo": 224, "val": 2}, ....]

, которые должны отображать значения sNo и val на графике при наведении мыши.

Я пытался найти решение, но ничего не помогло.

Одно решение, которое я нашел, - это принимать значения массива [3,1,2] в качестве входных данных и отображать их на графике, но мне нужны значения как sNo, так и val.

Надеюсь, вопрос ясен.Пожалуйста помоги.Спасибо.

Answer 1

вы можете попробовать использовать char.js с chartType = line

HTMLTemplate:

 <canvas baseChart
                [chartType]="'line'"
                [datasets]="YourchartData"
                [labels]="Yourlabels"
                [options]="YourOptions"
                elements: {
                      line: {
                         borderColor: '#000000',
                         borderWidth: 1
                },
                point: {
                       radius: 0
                       }
                },
                scales: {
                      yAxes: [
                       {
                         display: false
                       }
                    ],
                     xAxes: [
                      {
                        display: false
                      }
                  ]
                }
                [legend]="true"
                [colors]="colors"
                height="....">
        </canvas>

установить и импортировать char.js в app.module курса.

Я надеюсь, что помог вам