Создание файла Excel с помощью нескольких стилей, используя JavaScript на стороне клиента (если это возможно с помощью JS-XLSX библиотека)

Я хочу, чтобы создать файл Excel (в .xlsx формат) и сделать его доступным для загрузки с помощью Client Side JavaScript. Мне удалось создать образец файла, используя js-xlsx библиотека. Но я не могу применять к нему какие-либо стили. По крайней мере некоторые основные стили, включая цвета фона к заголовкам, жирного шрифта для заголовка и текста оберточного для клеток необходимы.Создание файла Excel с помощью нескольких стилей, используя JavaScript на стороне клиента (если это возможно с помощью JS-XLSX библиотека)

js-xlsx документация библиотеки говорит, что мы можем давать стили с использованием Cell Object.

Я пробовал давать стили, используя объект ячейки, но он не отражается в загруженном файле .xlsx. Я даже пробовал читать файл .xlsx и записывать тот же файл, используя XLSX.write(). Но он возвращает файл excel без стилей. В идеале я ожидаю, что загруженный файл будет иметь одинаковые стили загруженного файла. В обновленном файле не были применены цвета шрифта или цвета фона. Я использую Excel 2013 для тестирования загружаемых файлов.

Пожалуйста, найдите ниже скриншоты Excel до и после загрузки.

Оригинал Файл

Скачано файлов

код приведен ниже.

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> 
<script type="text/javascript" src="xlsx.core.min.js"></script> 
<script type="text/javascript" src="Blob.js"></script> 
<script type="text/javascript" src="FileSaver.js"></script> 

<script> 

function s2ab(s) { 
    var buf = new ArrayBuffer(s.length); 
    var view = new Uint8Array(buf); 
    for (var i=0; i!=s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF; 
    return buf; 
} 

/* set up XMLHttpRequest */ 
var url = "template-sample.xlsx"; 
var oReq = new XMLHttpRequest(); 
oReq.open("GET", url, true); 
oReq.responseType = "arraybuffer"; 

oReq.onload = function(e) { 
    var arraybuffer = oReq.response; 

    /* convert data to binary string */ 
    var data = new Uint8Array(arraybuffer); 
    var arr = new Array(); 
    for(var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]); 
    var bstr = arr.join(""); 

    /* Call XLSX */ 
    var workbook = XLSX.read(bstr, {type:"binary", cellStyles:true}); 

    console.log("read workbook"); 
    console.log(workbook); 
    /* DO SOMETHING WITH workbook HERE */ 
    var wbout = XLSX.write(workbook, {bookType:'xlsx', bookSST:true, type: 'binary', cellStyles: true}); 
    saveAs(new Blob([s2ab(wbout)],{type:"application/octet-stream"}), "template-download.xlsx"); 

} 

function read(){ 
    oReq.send();  
} 


</script> 


</head> 
<body> 
    <button onclick="read()">save xlsx</button> 
</body></html>

Образец взято с here.

Что я ожидаю - это либо вариант предоставления стилей ячейкам с использованием библиотеки js-xlsx или другой библиотеки, которая предоставляет эту функцию. Я нашел библиотеку с именем exceljs, но для ее поддержки требуется узел js. Я ищу чисто решение на стороне клиента. Это должно использоваться для Cordova планшетный и настольный компьютер.

источник

2016-11-08 Nithin Baby

После некоторых исследований я смог найти решение своего вопроса. Я нашел новую библиотеку по имени xlsx-style для создания стилей. xlsx-style построен поверх js-xlsx для предоставления стилей также созданному файлу excel. Стили могут быть предоставлены ячейкам с использованием нового атрибута внутри объекта ячейки.

Объяснение можно найти на странице npm xlsx-style.

Стили задаются с использованием объекта стиля, связанного с каждой ячейкой. Шрифт, цвет, выравнивание и т. Д. Можно задать с помощью этого объекта стиля.

Я добавил минималистскую демо-версию в github page. Код примера можно найти здесь github repository.

Вы можете найти скриншот сгенерированной страницы высокого уровня ниже.

источник

2017-01-12 09:05:29

Я искал одно и то же решение. Могли бы вы обновить пример кода, как вы это сделали, используя 'xlsx-style'. Моим требованием является запись данных в файл .xlsx с некоторым базовым стилем. Цените любую помощь. – gihan

Не могли бы вы сообщить мне, как объект стиля определен в объекте ячейки. Я пробовал этот путь, но не работает. 'Var cell = {v: data [R] [C], s: {bgColor:" # E1697B "}} ; ' – gihan

В ближайшее время я попытаюсь обновить рабочий код. –

Создание файла Excel с помощью нескольких стилей, используя JavaScript на стороне клиента (если это возможно с помощью JS-XLSX библиотека)

ответ

Смежные вопросы