2014-07-02 19 views
5

Mam prosty problem, ale nie mogę znaleźć prostego rozwiązania:Jak mogę przekazać lokalne dane pliku Excel do tablicy JavaScript (dla wykresów Google)?

Mam plik programu Excel (zawsze taki sam), z kilkoma arkuszami roboczymi, które współpracownicy spoza IT chcą aktualizować, aby aktualizuje wykresy Google (lub inną stronę API, którą możesz mi doradzić).

(Nawiasem mówiąc, ja tylko trzeba pewną część każdego arkusza tak, jeśli znasz sposób, aby wyodrębnić tylko co muszę, że byłoby świetnie :))

chciałbym uniknąć konieczności po stronie serwera operacja, ale być może nie jest to możliwe, ponieważ chcę odczytać plik lokalny.

Szukałem sposobów przekonwertowania na JSON lub załadowania jako łańcuch base64, używając xlsx.js, ale nie znajduję nic prostego, co moi koledzy mogliby z łatwością wykorzystać.

Dziękuję bardzo.

Edit

Znalazłem sposób to zrobić dokładnie to, co chciałem, więc jeśli ktoś może pomóc:

pierwsze, umieścić wszystkie dane, co potrzebne w jednym pliku csv.

Następnie użyłem FileAPI HTML5 do odczytania pliku CSV, który został załadowany przez dane wejściowe pliku.

W końcu użyłem skryptu cvstojson do parsowania pliku, a następnie przekazałem go do danych wykresu google w tabelach tak, jak chciałem.

Jednak to pozwoliło załadować dane tylko jeden raz, więc użyłem etykiety stylu przycisku do wprowadzania danych, która uruchomiła ukryty przycisk "reset" (faktycznie klonuje więcej niż resetowanie) po załadowaniu pliku, więc teraz wygląda jak jeden przycisk, który pozwala załadować plik wiele razy po zmianie danych w nim. Użyłem również localStorage jQuery do zapełnienia mojego json. wiem, że to jest dość brudny tak oto wyciąg Kod:

<div id="load"> 
    <button id="clear">Clear</button> 
    <label id="forcvs" for="cvs" > Load data </label> 
    <input type="file" id="cvs" onchange="handleFiles(this.files);" accept=".csv"><br/> 
</div> 

W „handleFiles” fonction prowadzi do skryptu cvstojson:

var json = JSON.parse(localStorage.getItem('json')) 

function handleFiles(files) { 
    // Check for the various File API support. 
    if (window.FileReader) { 
     // FileReader are supported. 
     getAsText(files[0]); 
    } else { 
     alert('FileReader are not supported in this browser.'); 
    } 
} 

function getAsText(fileToRead) { 
    var reader = new FileReader(); 
    // Read file into memory as UTF-8  
    reader.readAsText(fileToRead); 
    // Handle errors load 
    reader.onload = loadHandler; 
    reader.onerror = errorHandler; 
} 

function loadHandler(event) { 
    var csv = event.target.result; 
    processData(csv);   
} 

function processData(csv) { 
    object = $.csv.toObjects(csv, {separator:";"}) 
    drawOutput(object); 
} 

function errorHandler(evt) { 
    if(evt.target.error.name == "NotReadableError") { 
     alert("Canno't read file !"); 
    } 
} 

function drawOutput(object){ 
    json = object 
    localStorage.setItem('json', JSON.stringify(json)) 
    drawChart() 
    $("#clear").trigger("click"); 
} 

a następnie przed aktualizacją moich danych i rysunek mój wykres użyłem :

json = JSON.parse(localStorage.getItem('json')) 

Oto wyciąg z jQuery użyłem do tego:

var load = $('#cvs') 
$('#clear').click(function() { 
load.replaceWith(load = load.clone(true)) 
}) 

I CSS:

#cvs, #clear { 
    display: none; 
} 


#forcvs { 
    -webkit-appearance: button; 
    -moz-appearance: button; 
    appearance: button; 
    line-height: 16px; 
    padding: .2em .4em; 
    margin: .2em; 
} 

Nadzieję, że może pomóc kogoś i dzięki za odpowiedzi :)

+0

moja propozycja jest do korzystania z usługi Google Docs i [eksport arkuszy kalkulacyjnych] (http://blog.pamelafox.org/2013/06/exporting-google-spreadsheet -as-json.html) do JSON na wykresy –

+0

http://shancarter.github.io/mr-data-converter/ –

+0

Jeśli dane w arkuszach kalkulacyjnych nie są poufne, poufne lub w inny sposób uprzywilejowane, prześlij arkusz kalkulacyjny do Dokumenty Google umożliwiają korzystanie z wbudowanej obsługi [zapytań interfejsu wizualizacji] (https://developers.google.com/chart/interactive/docs/spreadsheets). Jest to najprostszy sposób pobierania danych z arkusza kalkulacyjnego programu Excel na wykresy interfejsu wizualizacji. Jeśli nie ma takiej możliwości, możesz uruchomić lokalny serwer internetowy (np. [WAMP] (www.wampserver.com), jeśli jesteś w systemie Windows), wyeksportuj plik Excel do CSV, załaduj plik CSV przez ajax z serwera WWW, i przeanalizuj dane CSV w DataTable. – asgallant

Odpowiedz

4

można spróbować Alasql JavaScript biblioteki do ładowania danych XLSX do tablicy JavaScript bez skomplikowanego programowania. Alasql używa biblioteki XLSX.js do pracy z plikami Excel.

To jest przykład:

<script src="alasql.min.js"></script> 
<script src='xlsx.core.min.js'></script> 
<script> 
    alasql('select * from xlsx("cities.xlsx",{headers:true, sheetid:"Sheet1", range:"A1:B6"})', 
      [],function(data) { 
       console.log(data); 
    }); 
</script> 

można uruchomić this sample w alasql.org strony.

Domyślnie opcja nagłówków ma wartość false, arkuszem jest "Arkusz1", zakres - wszystkie komórki na arkuszu.

Alasql obsługuje również formaty TXT, TAB, CSV, JSON i XLS. Można również produkować XLSX złożyć z powrotem z tablicy javascript:

var stars = [{star:"Aldebaran"},{star:"Algol"},{star:"Vega"}]; 
alasql('SELECT * INTO XSLX("stars.xlsx",{headers:true}) FROM ?',[stars]); 
+0

Dziękuję, że to wygląda bardzo schludnie. Prawdopodobnie wykorzystam to, ponieważ mogę ponownie pracować nad tym tematem. – CyrilFind