Как я могу прочитать файл Excel с JavaScript (без ActiveXObject)

Мой друг попросил меня сделать для простого приложения создание диаграмм (штрихов, кривых) из файла Excel. Я решил использовать JavaScript в качестве языка, так как я уже знаю мощные chart.js. Однако перед использованием chart.js мне нужно собрать данные из файла Excel. Итак, как читать файл Excel через JavaScript?

После некоторых исследований мне удалось сделать это с помощью Internet Explorer (с помощью ActiveX), но мне нужно, чтобы он работал в разных браузерах.

Ответ 1

Существуют библиотеки JavaScript, которые позволяют XLS и XLSX для анализа в чистом JavaScript. Я тестировал Chrome (хотя и в Windows), и он работал нормально.

Ответ 2

Вот еще одна перспектива этой проблемы, вместо чтения файла Excel с помощью JavaScript вы можете напрямую использовать JavaScript в Excel с помощью надстройки Funfun Excel. В принципе, Funfun - это инструмент, который позволяет использовать JavaScript в Excel, чтобы вы могли использовать библиотеки, такие как Chart.js, для построения графика из данных в электронной таблице.

В принципе, вам нужно сделать

1). Вставьте надстройку Funfun из Office Add-in store

введите описание изображения здесь

2). Создайте новый Funfun или загрузите образец из онлайн-редактора Funfun

введите описание изображения здесь

3). Запишите код JavaScrip, как и в любом другом редакторе JavaScript. На этом шаге, чтобы напрямую использовать данные из электронной таблицы, вам нужно написать несколько JSON I/O для создания ссылки на ячейку Excel. Место, где это значение находится в Настройка-коротком, но это будет всего несколько строк. Например, предположим, что у нас есть некоторые данные, как показано ниже в электронной таблице. Средние часы находятся в ячейке A1.

Average hours    Jan    Feb   Mar    Apr
Baby Jones       93.5   81    94.5   95.5
Joanne Jones     91.5   90    88.5   85.5

В этом случае значение ввода/вывода JSON будет:

{
    "months": "=C6:G6",
    "manager1": "=C7:G7",
    "manager2": "=C8:G8"
}

Более подробную информацию можно найти в документации Funfun .

4). Запустите код для построения графика

Вот пример диаграммы, которую я сделал с использованием JavaScript (Chart.js) и данных Excel в онлайн-редакторе Funfun. Вы можете проверить это по ссылке ниже. Вы также можете легко загрузить его в Excel, как описано в шаге 2.

https://www.funfun.io/1/edit/5a365e7c74efa7334ff272a6

Раскрытие информации: Я разработчик из Funfun.

Ответ 3

Существует плагин Chart.js chartjs-plugin-datasource, который позволяет легко загружать данные из файлов Excel.

Предположим, у вас есть файл Excel, как показано ниже, и он сохраняется как mydata.xlsx в том же каталоге, что и ваш файл HTML:

+---------------+---------+----------+-------+-------+------+------+------+
|               | January | February | March | April | May  | June | July |
+---------------+---------+----------+-------+-------+------+------+------+
| Temperature   |       7 |        7 |    10 |    15 |   20 |   23 |   26 |
+---------------+---------+----------+-------+-------+------+------+------+
| Precipitation |     8.1 |     14.9 |  41.0 |  31.4 | 42.6 | 57.5 | 36.0 |
+---------------+---------+----------+-------+-------+------+------+------+

Включите Chart.js, SheetJS (js-xlsx) и chartjs-plugin-datasource на своей странице:

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/xlsx.full.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"> </script>

<canvas id="myChart"></canvas>

Затем укажите mydata.xlsx в вашем скрипте.

var ctx = document.getElementsById("myChart");
var chart = new Chart(ctx, {
    type: 'bar',
    data: {
        datasets: [{
            type: 'line',
            yAxisID: 'temperature',
            backgroundColor: 'transparent',
            borderColor: 'rgb(255, 99, 132)',
            pointBackgroundColor: 'rgb(255, 99, 132)',
            tension: 0,
            fill: false
        }, {
            yAxisID: 'precipitation',
            backgroundColor: 'rgba(54, 162, 235, 0.5)',
            borderColor: 'transparent'
        }]
    },
    plugins: [ChartDataSource],
    options: {
        scales: {
            yAxes: [{
                id: 'temperature',
                gridLines: {
                    drawOnChartArea: false
                }
            }, {
                id: 'precipitation',
                position: 'right',
                gridLines: {
                    drawOnChartArea: false
                }
            }]
        },
        plugins: {
            datasource: {
                url: 'mydata.xlsx'
            }
        }
    }
});

Ответ 4

Я думаю, что без использования ActiveX вы не можете прочитать файл excel. Я не говорю, что вы не можете читать файл excel без ActiveX, возможно, есть способ, но я не знаю этого, поэтому, если вы хотите прочитать используя Activex, тогда вот код, который вы можете использовать для чтения файла excel

<input type="button" id="btnSubmit" onclick="readdata(1, 2)" value="Submit" />
<script>
var xVal = 1;
var yVal = 2

    function readdata(x,y) {
        x = xVal;
        y = yVal;
        try {
            var excel = new ActiveXObject("Excel.Application");
            excel.Visible = false;
            var excel_file = excel.Workbooks.Open("D:\\Test.xls");// alert(excel_file.worksheets.count);
            var excel_sheet = excel_file.Worksheets("Sheet1");

            for(i=0;i<5;i++)
            {
               var data = excel_sheet.Cells(i,2).Value;
                drawWithexcelValue(data);
            }


        }
        catch (ex) {
            alert(ex);
        }

</script>

он будет работать только в IE 9 и выше, и вы должны активировать функцию activeX из настроек.