Primer boleto para mí.
Estoy un poco atascado con un requisito simple.
Me gustaría poner un borde negro en este gráfico de barras.
CFFCHART( 'my-chart', { type:'bar', data:{ labels:['YOUR OVERALL SCENARIO', 'MARKET IMPLIED SCENARIO', 'WORST CASE SCENARIO', 'BASE CASE SCENARIO', 'BEST CASE SCENARIO'], datasets:[ { label:'UPSIDE/DOWNSIDE SCENARII ANALYSIS', data:[fieldname363, fieldname331, fieldname153, fieldname61, fieldname165], backgroundColor:['rgba(255,255,255, 0.4)', 'grey', 'rgba(255,0,0, 0.4)', 'rgba(60,179,113, 0.4)', 'rgba(0,0,255, 0.4'] } ] } } )Gracias de antemano por cualquier ayuda !
CFFCHART( 'my-chart', { type:'bar', data:{ labels:['YOUR OVERALL SCENARIO', 'MARKET IMPLIED SCENARIO', 'WORST CASE SCENARIO', 'BASE CASE SCENARIO', 'BEST CASE SCENARIO'], datasets:[ { label:'UPSIDE/DOWNSIDE SCENARII ANALYSIS', data:[fieldname363, fieldname331, fieldname153, fieldname61, fieldname165], backgroundColor:['rgba(255,255,255, 0.4)', 'grey', 'rgba(255,0,0, 0.4)', 'rgba(60,179,113, 0.4)', 'rgba(0,0,255, 0.4'], borderWidth: 2, borderColor:['rgba(0,0,0)','rgba(0,0,0)','rgba(0,0,0)','rgba(0,0,0)','rgba(0,0,0)'] } ] } } )No está muy claro si desea un borde alrededor de todo el gráfico o alrededor de las barras.
Si desea un borde alrededor de las barras:
Simplemente puede insertar una matriz borderColor en su conjunto de datos. Mira mi ejemplo:
var ctx = document.getElementById("my-chart").getContext("2d"); console.log('hi', ctx) var myChart = new Chart(ctx, { type: 'bar',/*from w ww.ja va2 s . com*/ data: { labels:['YOUR OVERALL SCENARIO', 'MARKET IMPLIED SCENARIO', 'WORST CASE SCENARIO', 'BASE CASE SCENARIO', 'BEST CASE SCENARIO'], datasets: [{ label: 'UPSIDE/DOWNSIDE SCENARII ANALYSIS', data: ['34', '55', '77', '96', '344'], backgroundColor:['rgba(255,255,255, 0.4)', 'grey', 'rgba(255,0,0, 0.4)', 'rgba(60,179,113, 0.4)', 'rgba(0,0,255, 0.4'], borderColor: [ 'black', 'black', 'black', 'black', 'black', 'black' ], borderWidth: 4 }] }, }); <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.js"></script> <div> <canvas id="my-chart" width="400" height="400"></canvas> </div> </body> </html>Ahora, si desea un borde alrededor de su gráfico, simplemente puede envolver el lienzo dentro de un div y agregarle un borde.
<div style="border:1px solid black;"> <canvas id="my-chart" width="400" height="400"></canvas> </div>Espero que pueda ayudarte.