В настоящее время я сталкиваюсь с проблемой при использовании пакета под названием jQuery Sparklines от Gareth Watts . У кого-нибудь есть опыт работы с этим пакетом? Это выглядит довольно устаревшим, но, надеюсь, некоторые люди все еще используют его здесь.
Я получаю данные из вызова AJAX и пытаюсь создать таблицу со спарклайном в строке таблицы, а затем добавить ее в в ДОМ. Я получаю сообщение об ошибке при вызове функции sparkline.
Это происходит только когда я добавляю в DOM. Если span
уже существует в DOM, он работает нормально.
Я проверил, правильно ли загружаются библиотеки jQuery и sparkline перед выполнением моего кода. Я не знаю, что происходит не так.
function createTable(tob) {
for (var [module, focusDetails] of Object.entries(tob)) {
var focusList = focusDetails.focusDetails;
var divColumn = $('<div>').addClass('column');
let divCard = $('<div>').addClass('card');
let table = $('<table>').addClass('table table-striped');
let thead = $('<thead>').addClass('thead');
let trtitle = $('<tr>');
let title = $('<b>').text(module);
trtitle.append(title);
thead.append(trtitle);
let trHead = $('<tr>');
let headRow = '<th></th><th>Tdy</th><th>Yda</th><th> % +/-</th><th>7 Days</th><th>Top Depts</th>';
trHead.append(headRow);
thead.append(trHead);
table.append(thead);
let tbody = $('<tbody>').addClass('tbody');
for (var [focusName, focusRow] of Object.entries(focusList)) {
let row = $('<tr>');
let tdFocusName = $('<td>').text(focusName);
let tdCountTday = $('<td>').text(focusRow.count_tdy);
let tdCountYday = $('<td>').text(focusRow.count_ydy);
let tdChart = $('<td>');
let barchart = $('<span> </span>');
barchart.sparkline([1, 2, 3, 2], {
type: 'bar'
});
//barchart.sparkline(focusRow.last7days, {type: 'bar'});
tdChart.append(barchart);
let tdLocation = $('<td>').text(focusRow.location_tdy);
row.append(tdFocusName);
row.append(tdCountTday);
row.append(tdCountYday);
row.append(tdChart);
row.append(tdLocation);
tbody.append(row);
}
table.append(tbody);
divCard.append(table);
divColumn.append(divCard);
$("#chart-row").append(divColumn);
$.sparkline_display_visible();
}
}