• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Float32Array von FloatFileStream einlesen.

M

Mathias1000

Member
Ich programmiere WebGL und möchte meine Vector-Daten von einer Datei einlesen.

Der bestehende Code sieht so aus:
PHP: 
    var fa = new Float32Array(Vectoren.Pos);
    gl.bufferData(gl.ARRAY_BUFFER, fa, gl.STATIC_DRAW);
Vectoren.Pos kommt von einer float-Array_
PHP: 
Pos: [-1.0, -1.0, 0.0,...........],
Wie bekomme ich meine Vector-Daten von einer Datei in den Float32Array ?

Die Datei enthält die Daten Binär.

Unter normalen Java kann man die Datei so auslesen:
PHP: 
	public static int readIntFrom(InputStream in) throws IOException {
		int ch1 = in.read();
		int ch2 = in.read();
		int ch3 = in.read();
		int ch4 = in.read();
		return ((ch1 << 0) + (ch2 << 8) + (ch3 << 16) + (ch4 << 24)); // Vertauscht!
	}
		FileInputStream inputstream = new FileInputStream("v:\\javatest.bin") ;
		int len = readIntFrom(inputstream); // Die ersten 4Bytes sind die Anzahl Elemente in der Array.

		byte[] data = new byte[len];
		inputstream.read(data);  // Hier werden Bytes eingelesen.
		for (int i = 0; i <= len - 1; i++) {
			System.out.println(data[i] + "  "); // Test, ob Daten richtig
		}
		inputstream.close();
 
Zuletzt bearbeitet:
für welche umgebung suchst du eine lösung? ein standard desktopbrowser kann nicht ins filesystem.
 
Die Animation sollte einfach im Browser laufen.
Die Binär-Datei befindet sich im gleichen Ordner wie die Index.html

Die Binär-Datei erzeuge ich während der Entwicklung mit einem Fremd-Programm
 
hesst schrieb:
https://developer.mozilla.org/de/docs/web/api/filereader
geht aber nur mit userinteraktion
Zum Vergrößern anklicken....
und:
Status
Working Draft
Zum Vergrößern anklicken....
!

Scheint aber schon ziemlich verbreitet zu sein => Can I use... Support tables for HTML5, CSS3, etc
Jemand praktische Erfahrung damit?

Weiß jemand ob es dazu schon eine jQuery Entsprechung gibt?
Das einzig sinnvolle Suchergebnis aus dem Hause Google scheint mir das zu sein: jquery - Using $(this) with FileReader() to target result - Stack Overflow
Aber das sieht da auch ziemlich zu Fuß aus.
 
Wenn die Datei auf dem Server
Mathias1000 schrieb:
im gleichen Ordner wie die Index.html
Zum Vergrößern anklicken....
ist, kannst du dir die einfach per AJAX holen. Wenn das aber keine Textdatei ist, musst du die Datei erst noch parsen.

@mikdoe: ich hab' damit schon ein bisschen rumgespielt und es funktioniert eigentlich ganz gut. Für was brauchst du da denn was mit jQuery? Für vier Statements lohnt sich das nicht.
 
Ich habe folgendes probiert.
Ich kann manuell eine meine Datei öffnen, lieber währe wen ich den Dateiname direkt im Script angeben kann.

Das einzige was im Script-Code richtig kommt, ist die Grösse der Datei.
Beim Rest kommt nur: Uncaught ReferenceError: DataStream is not defined

HTML: 
<html>
<input type='file' onchange='openFile(event)'>        
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        
        <script type="text/javascript" src="ausgabe.js"></script>        
        
        <div>Hello World</div>
    </body>
</html>

PHP: 
// ausgabe.js

var openFile = function (event) {
    var input = event.target;  // Wo ist der Datei-Name ?

    console.log(input.files);

    var reader = new FileReader();
    
    reader.onload = function () {
        var arrayBuffer = reader.result;
        var len = arrayBuffer.byteLength;
        console.log(len);  // Dies kommt richtig
        
        var stream = new DataStream(arrayBuffer, 0, DataStream.LITTLE_ENDIAN);
        len = stream.readUint32(); // Die ersten 4 Byte, welche die Länge der Daten enthält.

        console.log(len);  // len sollte in meinem Beispiel 10 sein.
   
        for (var i=0; i < len; i++) {
            var b = stream.readint8();
            console.log(b);  // Die einzelnen Byte ausgeben.
        }
    };
    reader.readAsArrayBuffer(input.files[0]);
};

openFile();

- - - Aktualisiert - - -

Wo kann ich den Datei-Name meine Binär-Datei angeben ?
Ich kann mit Google einfach nicht schlaues finden. :(

PHP: 
var openFile = function (event) {

    var reader = new FileReader(), rFilter = 'javatest.bin';
    
    reader.onload = function () {
        var arrayBuffer = reader.result;
        var len = arrayBuffer.byteLength;
        console.log(len);
        
//        var stream = new DataStream(arrayBuffer, 0, DataStream.LITTLE_ENDIAN);
//        len = stream.readUint32(); // Die ersten 4 Byte, welche die Länge der Daten enthält.

        console.log(len);  // len sollte in meinem Beispiel 10 sein.
   
        for (var i=0; i < len; i++) {
//            var b = stream.readUint8();
//            console.log(b);  // Die einzelnen Byte ausgeben.
        }
    };
    
//    var daten=['javatest.bin'];
//    var blob = new Blob(daten);
    
    var fileInput = document.getElementById('javatest.bin');
    var file = fileInput.files[0];     
    
    reader.readAsArrayBuffer(file);
};

openFile();
 
Äh... wo hast du das mit dem DataStream denn her? JS kennt sowas nicht. Genau das musst du dir selber schreiben (oder im Netz suchen).

PS: Warum arbeitest du mit der File-API? Ich dachte, die Datei liegt auf dem Server... dann musst du nämlich mit AJAX arbeiten.
 
kkapsner schrieb:
@mikdoe: ich hab' damit schon ein bisschen rumgespielt und es funktioniert eigentlich ganz gut. Für was brauchst du da denn was mit jQuery? Für vier Statements lohnt sich das nicht.
Zum Vergrößern anklicken....
Ah ok. Ich dachte, weil man da wieder mit Stati rum hantiert, dass es was ähnliches wie .ajax() gäbe, was einem alles abnimmt und auf success und error reduziert.

Würdest du deine Spielwiese eventuell hier im Forum in einem neuen Thread zeigen?
 
kkapsner schrieb:
PS: Warum arbeitest du mit der File-API? Ich dachte, die Datei liegt auf dem Server... dann musst du nämlich mit AJAX arbeiten.
Zum Vergrößern anklicken....
ich vermute er hat überhaupt keinen server, sondern eine html datei lokal, geöffnet über das file-protokoll.
ansonsten wäre es das einfachste, die datei schon serverseitig einzulesen und als js-daten mit einzubinden.

- - - Aktualisiert - - -

Mathias1000 schrieb:
Wo kann ich den Datei-Name meine Binär-Datei angeben ?
Zum Vergrößern anklicken....
nirgends, wenn das gehen würde, könnte jede webseite alle deine dateien auslesen. deswegen kann man nur dateien lesen, die der anwender explizit über ein input-element oder per drag&drop auswählt - siehe #7 userinteraktion.
 
nirgends, wenn das gehen würde, könnte jede webseite alle deine dateien auslesen. deswegen kann man nur dateien lesen, die der anwender explizit über ein input-element oder per drag&drop auswählt - siehe #7 userinteraktion.
Zum Vergrößern anklicken....
Das weis ich, das dies nicht geht.

Wahrscheinlich habe ich meine Frage schlecht ausgedrückt.

Die index.html und die javatest.bin, sollten sich beide auf der Home-Page befinden, z.B. so:

Code: 
www.meine-homepage.ch/index.html
www.meine-homepage.ch/javatest.bin

Ich kann mir nicht vorstellen, das dies nicht gehen soll.
 
Zuletzt bearbeitet:
https://developer.mozilla.org/en-US/...ng_Binary_Data
Zum Vergrößern anklicken....
Danke, genau dies habe ich gesucht.

PHP: 
"use strict";

var openFile = function (event) {

    var reader = new XMLHttpRequest();
    reader.open("GET", "data/javatest.bin", true); // geht
    reader.responseType = "arraybuffer";

    reader.onload = function () {
        var arrayBuffer = reader.response;
        var len = arrayBuffer.byteLength;
        console.log(len);

        var s = len.toString() + ' ';

        if (arrayBuffer) {
            var byteArray = new Uint8Array(arrayBuffer);
            for (var i = 0; i < byteArray.byteLength; i++) {
                s = s + byteArray[i].toString() + ' ';

                console.log(byteArray[i]);
                // do something with each byte in the array
            }
            alert(s);
        }
    };
    reader.send(null);
};

openFile();

Jetzt kommen die Daten, wie sie in der javatest.bin gespeichert sind.
http://mathias1000.bplaced.net/test/

Jetzt muss ich nur noch eine Stream-Classe schreiben.

Ich habe noch eine Frage mit den /\, wen ich es so mache wie bei deinem Link kommt nur ein Fehler, wie so ?

PHP: 
    reader.open("GET", "\data/javatest.bin", true); // geht
    reader.open("GET", "/data/javatest.bin", true); // geht nicht
    reader.open("GET", "data/javatest.bin", true); // geht
 
Zuletzt bearbeitet:
Die erste URL wird auch zu "data/javatest.bin", da es dasEscapezeichen "\d" nicht gibt und die zweite URL ist einfach falsch, da der Ordner data nicht im Root liegt.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben