JSFiddle - React, Tailwind, and code Playground
by budyniowski
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.bundle.min.js"></script>
<div style="width:75%;">
<canvas id="canvas"></canvas>
</div>
JavaScript
var chartColors = { blue: "rgb(54, 162, 235)",
green:"rgb(75, 192, 192)",
grey:"rgb(201, 203, 207)",
orange:"rgb(255, 159, 64)",
purple:"rgb(153, 102, 255)",
red:"rgb(255, 99, 132)",
yellow:"rgb(255, 205, 86)"
};
var config = {
type: 'line',
data: {
labels: [ "2017-09-01",
"2017-09-04",
"2017-09-05",
"2017-09-06",
"2017-09-07",
"2017-09-08",
"2017-09-11"
],
datasets: [{
label: "EUR",
borderColor: chartColors.red,
backgroundColor: chartColors.red,
fill: false,
data: [
"4.2457",
"4.2570",
"4.2361",
"4.2446",
"4.2466",
"4.2511",
"4.2426"
]
}, {
label: "USD",
borderColor: chartColors.blue,
backgroundColor: chartColors.blue,
fill: false,
data: [
"3.5693",
"3.5718",
"3.5642",
"3.5538",
"3.5511",
"3.5239",
"3.5293"
]
}]
},
options: {
responsive: true,
title:{
display:true,
text:'Zadanie Rafała'
},
tooltips: {
mode: 'index',
intersect: false,
},
hover: {
...