Advice regarding reading .mat file in p5.js

p5.js Project Guidance
1

Hi !
A js newbie here…
I’m trying to read a .mat file through p5.js
I found this library, but cannot quite integrate it with p5.js

Any pointers would be really helpful.

Thanks!!

2

Hi @ramith,

Just add the lib to your main html as described here…

Afterwards you can use it as here…

To get the ArrayBuffer just use

Cheers
— mnse

1 Like
3

An “index.html” example that remotely loads both mat4js & p5js libraries plus a local “sketch.js” file:

<script defer
  src=https://cdn.JsDelivr.net/gh/KovacsGG/mat4js/dist/mat4js.read.min.js>
</script>

<script async src=https://cdn.JsDelivr.net/npm/p5></script>

<script defer src=sketch.js></script>
4

Thank You @mnse & @GoToLoop !

I was able to read the mat file like this, and it worked :smiley:

let mat_result = []

function readFile(e) {
  console.log(e.target.files[0]);
  const file = e.target.files[0]
  let reader = new FileReader();

  reader.onloadend = function (e) {
      mat_result = mat4js.read(e.target.result);
  };

  reader.readAsArrayBuffer(file);

}

function setup() {
  angleMode(DEGREES); 


  input = createFileInput();
  input.position(0, 0);
  input.id('fileItem');
  input.changed(readFile);
}

only issue right now is that I get a warning as below. it works though

p5.min.js:3 
        Uncaught TypeError: o is not a function
    at e.onload (p5.min.js:3:528013)
5

In order to troubleshoot it you need to use the non-minimized version of p5.js:

<script defer
  src=https://cdn.JsDelivr.net/gh/KovacsGG/mat4js/dist/mat4js.read.min.js>
</script>

<script async src=https://Unpkg.com/p5/lib/p5.js></script>

<script defer src=sketch.js></script>
6

Thank you so much, finally i made it!