function loadJson(selector) { return JSON.parse(document.querySelector(selector).getAttribute('data-json')); } var jsonData = loadJson('#jsonData'); var full_data = jsonData.map((item) => item); var ctx = document.getElementById('sentiment-chart').getContext("2d"); new Chart(ctx, { type: 'line', data: { datasets: [ { label: "Sentiment", fill: false, backgroundColor: 'black', borderColor: 'lightblue', tension: 0.3, data: full_data, spanGaps: true, } ], }, options: { responsive: true, maintainAspectRatio: false, parsing: { xAxisKey: 'date', yAxisKey: 'value', }, plugins: { tooltip: { callbacks: { footer: function(context) { var foot = "Text: " + full_data[context[0].dataIndex].text + "\n"; foot += "Nick: " + full_data[context[0].dataIndex].nick + "\n"; foot += "Channel: " + full_data[context[0].dataIndex].channel + "\n"; foot += "Net: " + full_data[context[0].dataIndex].net; return foot; } } } } } });