ts основной так
import { ChartModule } from "angular2-chartjs";
и в ипорт добавил
imports: [
BrowserModule,
RouterModule.forRoot(appRoutes),
ChartModule
],
В сам компонент страницы импортировал так
import { Chart, LinearScale } from 'chart.js';
В компоненте пробую вызвать
ngOnInit(): void {
this.renderChart();
}
И сама функция
renderChart() {
var ctx = document.getElementById("myChart");
myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
},
options: {
scales: {
y: {
beginAtZero: true
}
}
}
})
}
Внутри html есть конечно же
<div>
<canvas id="myChart"></canvas>
</div>
Что я упускаю?
Ошибка что говорит myChart нил. Пробовал его создавать выше так myChart: Chart; - не помогло
Вот такая беда. пробовал создавать ctx по разному и перед функцией затем передавать ее и внутри по всякому
что-то мне подсказывает, что есть библиотека под ангуляр, а не вот это все
Я за любую движуху. Есть что-то лучше - подскажите пожалуйста. Я искал и все дороги вели к chartjs
мы у себя юзали ngx-echarts
не пользовался charts.js, но из ошибки видно, что typescript ожидает не HTMLElement, а другой объект
https://www.chartjs.org/docs/latest/getting-started/usage.html Ну я это не сам придумал
Спасибки. Глянем щас все
подозреваю, что обертка для ангуляра, которую ты поставил устарела, так как последняя ее публикация была 4 года назад)
Обсуждают сегодня