Estoy tratando de representar un gráfico de líneas usando "ng2-charts": "^2.3.0" y "chart.js": "^2.8.0" ,. El gráfico se muestra como se esperaba, pero el único problema es que no puedo aumentar el ancho de línea con la propiedad borderWidth .
Código:
import { SingleDataSet, Label, Color } from "ng2-charts"; import { ChartType, ChartOptions } from "chart.js"; public barChartType1: ChartType = "line"; public lineChartOptions: ChartOptions = { responsive: true, legend: { display: false }, scales: { yAxes: [ { display: false, ticks: { beginAtZero: false }, scaleLabel: { display: true, labelString: '', fontSize: 20, } }, ] }, elements: { point:{ radius: 0, borderWidth: 50 } }, }; public lineChartColors: Color[] = [ { borderColor: '#5081bd', backgroundColor: 'transparent', }, ];Modelo:
<canvas baseChart height="30vh" width="80vw" [colors]="lineChartColors" [datasets]="barChartDataSets1[customdata.index]" [labels]="barChartLabels1[customdata.index]" [options]="lineChartOptions" [chartType]="barChartType1" (chartHover)="chartHovered($event)" (chartClick)="chartClicked($event)"> </canvas>Entradas:
barChartDataSets1 [{"data":["2.00","2.00","2.00","2.00","2.00","2.00","2.00","2.00"] barChartLabels1 [" "," "," ","ans1"," "," "," ","ans2"]Producción:
¿Hay alguna solución para esto y por qué cambiar la propiedad borderWidth no funciona?
Esto se debe a que colocó la opción en el espacio de nombres incorrecto en lugar de usar options.elements.point , debe colocarla en options.elements.line :
elements: { point: { radius: 0, }, line: { borderWidth: 8 } },