jeromeetienne / AR.js

Efficient Augmented Reality for the Web - 60fps on mobile!
MIT License
15.79k stars 2.22k forks source link

Custom Marker Training - Downloaded Pattern not working #127

Closed markleeyw closed 6 years ago

markleeyw commented 7 years ago

https://jeromeetienne.github.io/AR.js/three.js/examples/marker-training/examples/generator.html

Used the default AR.js image, downloaded the pattern.

Code:

Marker not detected. Does anyone get the same problem?

MrRaam commented 7 years ago

@markleeyw I think the best option is to train that and include its path in the source code. I did that manually and its working.

markleeyw commented 7 years ago

@MrRaam Any sample on what you did?

Dinkelborg commented 7 years ago

I'm getting the same error I tried to create a customer marker with the website and get: "Pattern Data read error!! aframe-ar.js:2843 loadMarker(): Error loading pattern file /marker_0. aframe-ar.js:2843 ARToolKitJS(): Unable to set up AR marker. aframe-ar.js:2843 Out of memory!!"

I'm also stuck on what to try as I already tried a smaller marker its now less than 400x400 px

MrRaam commented 7 years ago

Where are you storing the pattern ? & are you changing the path files in the ar.js ? On Jul 13, 2017 12:07 AM, "Dinkelborg" notifications@github.com wrote:

I'm getting the same error I tried to create a customer marker with the website and get: "Pattern Data read error!! aframe-ar.js:2843 loadMarker(): Error loading pattern file /marker_0. aframe-ar.js:2843 ARToolKitJS(): Unable to set up AR marker. aframe-ar.js:2843 Out of memory!!"

I'm also stuck on what to try as I already tried a smaller marker its now less than 400x400 px

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jeromeetienne/AR.js/issues/127#issuecomment-314858853, or mute the thread https://github.com/notifications/unsubscribe-auth/Ab0zlFzuJNIqxT9lRwVwk0QbMttEu1NLks5sNRJdgaJpZM4OShOm .

markleeyw commented 7 years ago

@MrRaam could you share how to did yours. It would be helpful

Dinkelborg commented 7 years ago

I generated the pattern here where the pdf generation doesn't work btw... but whatever

I then stored that as "pattern-marker.patt" in the root folder of my site (next to index.html) and then changed the example maker from

to

I also tried

Both cause the above mentioned errors - the patt-file looks normal to me - exact same amount of lines as the hiro example pattern and I can clearly see my marker logo in the numbers.

I followed these steps but it's just not working

markleeyw commented 7 years ago

@Dinkelborg yup .. i think the code ... a-maker-camera.... does not work somehow. .. i used their default marker too.

markleeyw commented 7 years ago

@Dinkelborg Found this but not time to try ... if you get it to work do let me know https://github.com/jeromeetienne/AR.js/issues/61 Thank you!

Dinkelborg commented 7 years ago

@markleeyw Awesome man! Thanks a lot, it took quite a while to dig into the aframe-ar.js file, but if you create your own preset, as descried in the post you linked, it does work!

Now I still hope that they fix the regular tag implementation using the "type='pattern'" and "patternUrl" parameters since that wouldn't require changing the source of the library every time you want to use a custom marker.

Dinkelborg commented 7 years ago

You don't have to create your own data folder btw I kept everything as it is, created a custom variable (line 865) THREEx.ArToolkitContext.hostURL = './' directly under (line 864) THREEx.ArToolkitContext.baseURL = 'https://jeromeetienne.github.io/AR.js/three.js/'

then I changed the Reset paragraph (line 1195 to 1217) to:

//////////////////////////////////////////////////////////////////////////////
//      Code Separator
//////////////////////////////////////////////////////////////////////////////

/**
 * reset all parameters
 */
THREEx.ArToolkitProfile.prototype.reset = function () {
    this.sourceParameters = {
        // to read from the webcam 
        sourceType : 'webcam',
    }

    this.contextParameters = {
        cameraParametersUrl: THREEx.ArToolkitContext.baseURL + '../data/data/camera_para.dat',
        detectionMode: 'mono',
    }
    this.defaultMarkerParameters = {
        type : 'pattern',
        patternUrl : THREEx.ArToolkitContext.hostURL + 'pattern-marker.patt'
    }
    return this
};

(basically only change is under "this.defaultMarkerParameters" where you change the patternUrl)

and then I created a new Marker under (line 1255 to 1280):

//////////////////////////////////////////////////////////////////////////////
//      Marker
//////////////////////////////////////////////////////////////////////////////
THREEx.ArToolkitProfile.prototype.kanjiMarker = function () {
    this.contextParameters.detectionMode = 'mono'

    this.defaultMarkerParameters.type = 'pattern'
    this.defaultMarkerParameters.patternUrl = THREEx.ArToolkitContext.baseURL + '../data/data/patt.kanji'
    return this
}

THREEx.ArToolkitProfile.prototype.hiroMarker = function () {
    this.contextParameters.detectionMode = 'mono'

    this.defaultMarkerParameters.type = 'pattern'
    this.defaultMarkerParameters.patternUrl = THREEx.ArToolkitContext.baseURL + '../data/data/patt.hiro'
    return this
}

THREEx.ArToolkitProfile.prototype.myCustomMarker= function () {
  this.contextParameters.detectionMode = 'mono'

  this.defaultMarkerParameters.type = 'pattern'
  this.defaultMarkerParameters.patternUrl = THREEx.ArToolKitContext.hostURL+ 'pattern-marker.patt'
  return this
}

(see the last marker was added the rest is default)

and the last step is to add your marker preset to the init function (line 2729) preset check (line 2737 to 2752):

        // honor this.data.preset
        if( this.data.preset === 'hiro' ){
            this.data.type = 'pattern'
            this.data.patternUrl = THREEx.ArToolkitContext.baseURL+'examples/marker-training/examples/pattern-files/pattern-hiro.patt'
        }else if( this.data.preset === 'kanji' ){
            this.data.type = 'pattern'
            this.data.patternUrl = THREEx.ArToolkitContext.baseURL+'examples/marker-training/examples/pattern-files/pattern-kanji.patt'
        }else if( this.data.preset === 'area' ){
            this.data.type = 'area'
            // fall through
        }else if( this.data.preset === 'myCustomMarker'){
      this.data.type = 'pattern'
      this.data.patternUrl = THREEx.ArToolkitContext.hostURL+'pattern-marker.patt'
    } else {
            console.assert( this.data.preset === '', 'illegal preset value '+this.data.preset)
        }

(see the pre-last statement if(this.data.preset === 'myCustomMarker')... )

After all of that you can just use your custom preset like the hiro preset so in the html, in the just swap the 'preset' value from 'hiro' to 'myCustomMarker' (or whatever you called yours

When you try, make sure to clear cache if it doesn't work instantly - but that was all works like a charm for me now

//PS// Btw the pattern-marker.patt I downloaded from the website is in my root folder, that's why "hostURL" for me is "./" if you store your pattern file somewhere else, change this to the according path

MrRaam commented 7 years ago

Sorry couldn't get back on time,

for people who are not able link the pattern url properly, try uploading the pattern file in Github and then use that file link in the ar.js file. On Jul 13, 2017 6:22 PM, "Dinkelborg" notifications@github.com wrote:

You don't have to create your own data folder btw I kept everything as it is, created a custom variable (line 865) THREEx.ArToolkitContext.hostURL = './' directly under (line 864) THREEx.ArToolkitContext.baseURL = ' https://jeromeetienne.github.io/AR.js/three.js/'

then I changed the Reset paragraph (line 1195 to 1217) to:

////////////////////////////////////////////////////////////////////////////// // Code Separator //////////////////////////////////////////////////////////////////////////////

/**

  • reset all parameters */ THREEx.ArToolkitProfile.prototype.reset = function () { this.sourceParameters = { // to read from the webcam sourceType : 'webcam', }

    this.contextParameters = { cameraParametersUrl: THREEx.ArToolkitContext.baseURL + '../data/data/camera_para.dat', detectionMode: 'mono', } this.defaultMarkerParameters = { type : 'pattern', patternUrl : THREEx.ArToolkitContext.hostURL + 'pattern-marker.patt' } return this };

(basically only change is under "this.defaultMarkerParameters" where you change the patternUrl)

and then I created a new Marker under (line 1255 to 1280):

////////////////////////////////////////////////////////////////////////////// // Marker ////////////////////////////////////////////////////////////////////////////// THREEx.ArToolkitProfile.prototype.kanjiMarker = function () { this.contextParameters.detectionMode = 'mono'

this.defaultMarkerParameters.type = 'pattern' this.defaultMarkerParameters.patternUrl = THREEx.ArToolkitContext.baseURL + '../data/data/patt.kanji' return this }

THREEx.ArToolkitProfile.prototype.hiroMarker = function () { this.contextParameters.detectionMode = 'mono'

this.defaultMarkerParameters.type = 'pattern' this.defaultMarkerParameters.patternUrl = THREEx.ArToolkitContext.baseURL + '../data/data/patt.hiro' return this }

THREEx.ArToolkitProfile.prototype.myCustomMarker= function () { this.contextParameters.detectionMode = 'mono'

this.defaultMarkerParameters.type = 'pattern' this.defaultMarkerParameters.patternUrl = THREEx.ArToolKitContext.hostURL+ 'pattern-marker.patt' return this }

(see the last marker was added the rest is default)

and the last step is to add your marker preset to the init function (line 2729) preset check (line 2737 to 2752):

  // honor this.data.preset
  if( this.data.preset === 'hiro' ){
      this.data.type = 'pattern'
      this.data.patternUrl = THREEx.ArToolkitContext.baseURL+'examples/marker-training/examples/pattern-files/pattern-hiro.patt'
  }else if( this.data.preset === 'kanji' ){
      this.data.type = 'pattern'
      this.data.patternUrl = THREEx.ArToolkitContext.baseURL+'examples/marker-training/examples/pattern-files/pattern-kanji.patt'
  }else if( this.data.preset === 'area' ){
      this.data.type = 'area'
      // fall through
  }else if( this.data.preset === 'myCustomMarker'){
  this.data.type = 'pattern'
  this.data.patternUrl = THREEx.ArToolkitContext.hostURL+'pattern-marker.patt'
} else {
      console.assert( this.data.preset === '', 'illegal preset value '+this.data.preset)
  }

(see the pre-last statement if(this.data.preset === 'myCustomMarker')... )

After all of that you can just use your custom preset like the hiro preset so in the html, in the just swap the 'preset' value from 'hiro' to 'myCustomMarker' (or whatever you called yours

When you try, make sure to clear cache if it doesn't work instantly - but that was all works like a charm for me now

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jeromeetienne/AR.js/issues/127#issuecomment-315068635, or mute the thread https://github.com/notifications/unsubscribe-auth/Ab0zlKU92sN5FTAjMjHA1CpJ02xCM-Q3ks5sNhMkgaJpZM4OShOm .

imehrotra commented 7 years ago

@MrRaam were you able to just upload the patt file and add this <a-marker-camera type='pattern' patternUrl='https://raw.github.com/username/project/master/pattern-marker.patt'></a-marker-camera> to your code and have it recognize it? As of now, I am just trying to get it to work with the provided new Ar.js marker and I get the console output:

"Pattern Data read error!! aframe-ar.js:2843 loadMarker(): Error loading pattern file /marker_0. aframe-ar.js:2843 ARToolKitJS(): Unable to set up AR marker. aframe-ar.js:2843 Out of memory!!"

Any help would be appreciated. I also tried cloning the directory and changing the code myself as was suggested aboe to no avail, but will retry again with the provided Ar.js marker in case my marker was invalid for some reason.

Dinkelborg commented 7 years ago

@imehrotra You are experiencing the same problem I had. The steps I describe above should work for you, can you explain what went wrong when you tried changing the code? I was going to try and find out where the tag recognition is broken in the aframe-ar.js file, but for once it's kinda huge and I didn't make it, besides that I didn't have the time yet. I think that they expect the custom maker pattern files in a specific folder, but that isn't really stated clearly - it might as well be that it's just broken

imehrotra commented 7 years ago

When I change the code, I don't get any errors, but it just doesn't detect the marker. I think there might be something wrong with my script urls in the html ar.js file. What did you change the scripts too? Right now, mine are set as

  <script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script>
  <script src="ar/aframe/build/aframe-ar.js"></script> // this is my local copy of the edited code
Dinkelborg commented 7 years ago

I went over the changes I made in the aframe-ar.js file step by step and pointed out what exactly I changed... I don't think I could make that any clearer ... Your urls look fine these are in the head-section of my index.html:

<script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script>
  <script src="js/aframe-ar.js"></script>//My changed local copy
  <script>THREEx.ArToolkitContext.baseURL = 'https://rawgit.com/jeromeetienne/AR.js/master/three.js/'</script>
  <link href="https://fonts.googleapis.com/css?family=Oswald" rel="stylesheet">
MrRaam commented 7 years ago

@imehrotra https://github.com/imehrotra you are almost there, I didn't use the pattern url like as you did instead i referenced a my own marker variable by making changes in aframe-ar.js, you have to change in aframe-ar.js just like @Dinkelborg did, i think it's almost the same which i did with few variations. Let me know if you are still not able to get that.

On Tue, Jul 18, 2017 at 1:53 AM, Dinkelborg notifications@github.com wrote:

I went over the changes I made in the aframe-ar.js file step by step and pointed out what exactly I changed... I don't think I could make that any clearer ... Your urls look fine these are in the head-section of my index.html: `

//My changed local copy ` — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub , or mute the thread .
imehrotra commented 7 years ago

I'm not sure what the issue was originally, but I redid the steps and it works now - thanks for your help! @Dinkelborg @MrRaam

machenmusik commented 7 years ago

Looks like the syntax for <a-marker-camera> is something like <a-marker-camera type='pattern' url='your-url-here'></a-marker-camera> (not patternURL)

khookeiwai commented 7 years ago

@machenmusik it works for me! thanks!

kumarahir commented 7 years ago

@machenmusik following code works for me too !

Looks like the syntax for <a-marker-camera> is something like <a-marker-camera type='pattern' url='your-url-here'></a-marker-camera> (not patternURL)

machenmusik commented 7 years ago

Great! Perhaps this issue can be closed then.

achatt89 commented 7 years ago

@Dinkelborg / @MrRaam Hey..how is it going?? Just a quick question.. What version were you working in when you wrote the steps to add the custom marker to aframe-ar.js?

The latest version seems to have quite a few things missing based on your steps and also the line numbers are wayy out of place.. (well..don't care about the line numbers as such.. :D) Also, from what I can understand, its possible to train only one customMarker, is it?

Regards..

Dinkelborg commented 7 years ago

Hi @achatt89 , I believe I worked with version 1.0.0 my files are from the 12th of July. Yeah at least with my work-around only one marker could be trained, but seeing that several other users like @machenmusik report the a-marker-camera tag to be working I believe my fix should no longer be necessary

I didn't try their solution, does Work for you? The docs say patternURL but apparently it's just url instead

achatt89 commented 7 years ago

Hi.. Thanks for the reply mate :) Nope patternUrl doesn't work.. Haven't tried just URL though... Following your method, it does work fine for just one custom marker... But the project I am trying to implement requires multiple custom markers to be trained. I also noticed that the latest version of aframe-ar.js has Kanji marker removed for some reason..

Anyways...thank you very much for the original assist with the custom marker training.. it worked just fine..

Cheers.. :) P.S. I will keep digging for multiple custom marker training and will keep you posted if I am successful..

On 18 Aug 2017 19:52, "Dinkelborg" notifications@github.com wrote:

Hi @achatt89 https://github.com/achatt89 , I believe I worked with version 1.0.0 my files are from the 12th of July. Yeah at least with my work-around only one marker could be trained, but seeing that several other users like @machenmusik https://github.com/machenmusik report the a-marker-camera tag to be working I believe my fix should no longer be necessary

I didn't try their solution, does Work for you? The docs say patternURL but apparently it's just url instead

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jeromeetienne/AR.js/issues/127#issuecomment-323433658, or mute the thread https://github.com/notifications/unsubscribe-auth/AGK-K_NqInqESz2zLFiDBwT3ODYfPPLuks5sZd2HgaJpZM4OShOm .

sonalranjit commented 7 years ago

@kumarahir which version of the aframe-ar.js are you using, im following the latest 1.5.0 but using url for the marker is not working for me.

achatt89 commented 7 years ago

@jeromeetienne / @Dinkelborg / @MrRaam: the a-marker-camera tag doesn't seem to be working for using custom patterns. I have tried with both patternUrl & url. I am using version 1.5.1.

@machenmusik : It seems to be working for you. Can you confirm on how you achieved it?

Regards..

MrRaam commented 7 years ago

@Abhijit can i see the error log if there is any?

On Mon, Aug 21, 2017 at 4:12 PM, Abhijit Chatterjee < notifications@github.com> wrote:

@jeromeetienne https://github.com/jeromeetienne / @Dinkelborg https://github.com/dinkelborg / @MrRaam https://github.com/mrraam: the tag doesn't seem to be working for using custom patterns. I have tried with both patternUrl & url. I am using version 1.5.1.

@machenmusik https://github.com/machenmusik : It seems to be working for you. Can you confirm on how you achieved it?

Regards..

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jeromeetienne/AR.js/issues/127#issuecomment-323711049, or mute the thread https://github.com/notifications/unsubscribe-auth/Ab0zlL0C8zKZqLrK1IG_nI3LLt8UouO1ks5saV8TgaJpZM4OShOm .

achatt89 commented 7 years ago

@MrRaam / @jeromeetienne Here's the code what I am using:

<a-scene embedded arjs='sourceType: webcam;'>
    <a-assets>
        <img id="building_info" src="./images/building_info.png">
    </a-assets>
    <a-image src="#building_info" position="0 0 0" scale="2.5 2.5 2.5" rotate="0 0 90"></a-image>

    <!--<a-marker-camera preset="greenTriangleMarker"></a-marker-camera>-->
    <a-marker-camera type='pattern' url='./patterns/green-triangle-marker.patt'></a-marker-camera>

</a-scene>

There's no console error. The pattern doesn't even load nor is recognised while trying to scan. Its not shown in the network/sources tab.

Regards..

MrRaam commented 7 years ago

Hi,

Please upload that .patt files in github and place that link in the url. it should work. Cheers !

On Mon, Aug 21, 2017 at 7:46 PM, Abhijit Chatterjee < notifications@github.com> wrote:

@MrRaam https://github.com/mrraam / @jeromeetienne https://github.com/jeromeetienne Here's the code what I am using: `

http://./images/building_info.png

`

There's no console error. The pattern doesn't even load nor is recognised while trying to scan. Its not shown in the network/sources tab.

Regards..

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/jeromeetienne/AR.js/issues/127#issuecomment-323753795, or mute the thread https://github.com/notifications/unsubscribe-auth/Ab0zlJNc9YJRfvQBCcCDrnZ8KEjFdbHzks5saZFKgaJpZM4OShOm .

achatt89 commented 7 years ago

@MrRaam : Hi.. That doesn't work. I have tried it before.. Here's the link to my patt file:

https://github.com/achatt89/abhijitchatterjee.com/blob/master/green-triangle-marker.patt Cheers.. :)

wimvdc commented 7 years ago

Hi guys,

I think I solved the issue in #164 (check the PR).

kumarahir commented 7 years ago

@sonalranjit using latest 0.6.0 version of aframe and aframe-ar is directly being loaded from https://jeromeetienne.github.io/AR.js/aframe/build/aframe-ar.js

This is working perfectly

<script src="../lib/0.6.0/aframe.min.js"></script>
<!-- include ar.js for A-Frame -->
<script src="https://jeromeetienne.github.io/AR.js/aframe/build/aframe-ar.js"></script>
<body style='margin : 0px; overflow: hidden;'>
  <a-scene embedded arjs>
    <a-assets>
        <a-asset-item id='wolf' src='Wolf.obj'></a-asset-item>
    </a-assets>

    <!-- define a camera which will move according to the marker position -->
    <a-marker type='pattern' url='letterk.patt'>
        <a-obj-model src="#wolf" scale="0.01 0.01 0.01"></a-obj-model>
    </a-marker>
    <a-entity camera></a-entity>
  </a-scene>
</body>
sonalranjit commented 7 years ago

@kumarahir i tired your way it is still only triggering for the default Hiro pattern.

`

`

image

will checkout @wimvdc 's fix

vin-ni commented 7 years ago

I made it work with these instructions: https://github.com/jeromeetienne/AR.js/issues/164#issuecomment-332065686

machenmusik commented 7 years ago

Looking at what @vin-ni used,

It seems as though the common mistake is trying to use a-marker when the correct primitive to use is a-marker-camera - I am pretty sure that I didn't need to change to light grey etc.

IgorDePaula commented 6 years ago

Nothing this work for me =/

Kimara5 commented 5 years ago

You don't have to create your own data folder btw I kept everything as it is, created a custom variable (line 865) THREEx.ArToolkitContext.hostURL = './' directly under (line 864) THREEx.ArToolkitContext.baseURL = 'https://jeromeetienne.github.io/AR.js/three.js/'

then I changed the Reset paragraph (line 1195 to 1217) to:

//////////////////////////////////////////////////////////////////////////////
//        Code Separator
//////////////////////////////////////////////////////////////////////////////

/**
 * reset all parameters
 */
THREEx.ArToolkitProfile.prototype.reset = function () {
  this.sourceParameters = {
      // to read from the webcam 
      sourceType : 'webcam',
  }

  this.contextParameters = {
      cameraParametersUrl: THREEx.ArToolkitContext.baseURL + '../data/data/camera_para.dat',
      detectionMode: 'mono',
  }
  this.defaultMarkerParameters = {
      type : 'pattern',
      patternUrl : THREEx.ArToolkitContext.hostURL + 'pattern-marker.patt'
  }
  return this
};

(basically only change is under "this.defaultMarkerParameters" where you change the patternUrl)

and then I created a new Marker under (line 1255 to 1280):

//////////////////////////////////////////////////////////////////////////////
//        Marker
//////////////////////////////////////////////////////////////////////////////
THREEx.ArToolkitProfile.prototype.kanjiMarker = function () {
  this.contextParameters.detectionMode = 'mono'

  this.defaultMarkerParameters.type = 'pattern'
  this.defaultMarkerParameters.patternUrl = THREEx.ArToolkitContext.baseURL + '../data/data/patt.kanji'
  return this
}

THREEx.ArToolkitProfile.prototype.hiroMarker = function () {
  this.contextParameters.detectionMode = 'mono'

  this.defaultMarkerParameters.type = 'pattern'
  this.defaultMarkerParameters.patternUrl = THREEx.ArToolkitContext.baseURL + '../data/data/patt.hiro'
  return this
}

THREEx.ArToolkitProfile.prototype.myCustomMarker= function () {
  this.contextParameters.detectionMode = 'mono'

  this.defaultMarkerParameters.type = 'pattern'
  this.defaultMarkerParameters.patternUrl = THREEx.ArToolKitContext.hostURL+ 'pattern-marker.patt'
  return this
}

(see the last marker was added the rest is default)

and the last step is to add your marker preset to the init function (line 2729) preset check (line 2737 to 2752):

      // honor this.data.preset
      if( this.data.preset === 'hiro' ){
          this.data.type = 'pattern'
          this.data.patternUrl = THREEx.ArToolkitContext.baseURL+'examples/marker-training/examples/pattern-files/pattern-hiro.patt'
      }else if( this.data.preset === 'kanji' ){
          this.data.type = 'pattern'
          this.data.patternUrl = THREEx.ArToolkitContext.baseURL+'examples/marker-training/examples/pattern-files/pattern-kanji.patt'
      }else if( this.data.preset === 'area' ){
          this.data.type = 'area'
          // fall through
      }else if( this.data.preset === 'myCustomMarker'){
      this.data.type = 'pattern'
      this.data.patternUrl = THREEx.ArToolkitContext.hostURL+'pattern-marker.patt'
    } else {
          console.assert( this.data.preset === '', 'illegal preset value '+this.data.preset)
      }

(see the pre-last statement if(this.data.preset === 'myCustomMarker')... )

After all of that you can just use your custom preset like the hiro preset so in the html, in the just swap the 'preset' value from 'hiro' to 'myCustomMarker' (or whatever you called yours

When you try, make sure to clear cache if it doesn't work instantly - but that was all works like a charm for me now

//PS// Btw the pattern-marker.patt I downloaded from the website is in my root folder, that's why "hostURL" for me is "./" if you store your pattern file somewhere else, change this to the according path

Hi!! I'm facing the same issue, and tried to follow this steps, but it looks like the aframe-ar.js code has changed?? In my case, this exactly my error:

components:gltf-model:warn Failed to load glTF model browser.js:111:7
Pattern Data read error!! aframe-ar.js:2:23001
loadMarker(): Error loading pattern file /marker_0. aframe-ar.js:2:23001
ARToolKitJS(): Unable to set up AR marker. aframe-ar.js:2:23001
Out of memory!! aframe-ar.js:2:23001
ExitStatus: Program terminated with exit(1)

But sometimes the error is:

uncaught exception: abort("Cannot enlarge memory arrays. Either (1) compile with  -s TOTAL_MEMORY=X  with X higher than the current value 536870912, (2) compile with  -s ALLOW_MEMORY_GROWTH=1  which adjusts the size at runtime but prevents some optimizations, (3) set Module.TOTAL_MEMORY to a higher value before the program runs, or if you want malloc to return NULL (0) instead of this abort, compile with  -s ABORTING_MALLOC=0 ") at jsStackTrace@http://.../libs/AR.js-master/aframe-ar.js:2:41099
stackTrace@http://.../libs/AR.js-master/aframe-ar.js:2:41282
abort@http://.../libs/AR.js-master/aframe-ar.js:19:4866
abortOnCannotGrowMemory@http://...r/libs/AR.js-master/aframe-ar.js:2:41642
enlargeMemory@http://.../libs/AR.js-master/aframe-ar.js:2:42087
dynamicAlloc@http://.../libs/AR.js-master/aframe-ar.js:2:26568
_sbrk@http://.../libs/AR.js-master/aframe-ar.js:2:195241
Uj@http://.../libs/AR.js-master/aframe-ar.js:9:1
Wj@http://.../libs/AR.js-master/aframe-ar.js:9:1
Ee@http://.../libs/AR.js-master/aframe-ar.js:10:1
De@http://.../libs/AR.js-master/aframe-ar.js:11:1
je@http://.../libs/AR.js-master/aframe-ar.js:11:1
de@http://.../libs/AR.js-master/aframe-ar.js:11:1
wg@http://.../libs/AR.js-master/aframe-ar.js:10:1
lh@http://.../libs/AR.js-master/aframe-ar.js:10:1
Gk@http://.../libs/AR.js-master/aframe-ar.js:12:1
dynCall_iii_10@http://.../libs/AR.js-master/aframe-ar.js line 2 > Function:4:12
detectMarker@http://.../libs/AR.js-master/aframe-ar.js line 2 > Function:8:10
ARController.prototype.detectMarker@http://.../libs/AR.js-master/aframe-ar.js:519:11
ARController.prototype.process@http://.../libs/AR.js-master/aframe-ar.js:139:3
ARjs.Context.prototype._updateArtoolkit@http://.../libs/AR.js-master/aframe-ar.js:5460:2
ARjs.Context.prototype.update@http://.../libs/AR.js-master/aframe-ar.js:5329:3
ARjs.Session/this.update@http://.../libs/AR.js-master/aframe-ar.js:7131:3
tick@http://.../libs/AR.js-master/aframe-ar.js:8815:3
value@http://.../libs/aframe-docs-v0.8.0/aframe-master.min.js:483:9129
value@http://.../libs/aframe-docs-v0.8.0/aframe-master.min.js:483:9527
[189]</module.exports/</<@http://.../libs/aframe-docs-v0.8.0/aframe-master.min.js:608:130
y@http://.../libs/aframe-docs-v0.8.0/aframe-master.min.js:100:15179

If this abort() is unexpected, build with -s ASSERTIONS=1 which can give more information.
I have a local server, and there is working perfect, even from a mobile accessing from network.
But when I upload it to my webServer and try to run it online, this happens... from android, iphone or computer (with Firefox 'cause of the https limitations).

Is there something to do with this? Please I'm stuck with this since 3 days ago.

Thanks!! :)