iink SDK Web

Answered

Changing font-size and line-height results in lag of stroke visualization

Hello,

when I change the font-size and line-height through:

 

this.editor.innerTheme = {'.text': {'font-size': 10, 'line-height': 1.5}};

 the line-height and font-size are indeed adapted. However, when handwriting something, there is a significant lag until I see the "ink" coming out of the pen. Specifically, the stroke is only rendered when the recognition finished. So it feels like writing is not working, but indeed I write with invisible ink until the recognition is complete, when it is set to black.

Without the above line, i.e. with the default settings, the ink is displayed immediately. The recognition time itself seems to be identical.


Any ideas what I am doing wrong?


Thanks and kind regards

Nico

 


Best Answer

Thanks again for the quick reply. It is working now. My only problem was that I was changing "innerTheme" instead of "theme". So my above changes as follows works well:

 

this.editor.theme= {'.text': {'font-size': 10, 'line-height': 1.5}};

 


Dear Nico,


currently, it seems you are using the myscript-text-web.


Instead, can you please try using the MyScriptJS, as the myscript-text-web is no longer maintained.


Indeed, using the MyScriptJS, I could easily get your theme working fine in the customize_style.html (I just added it as follows in the themes list):

 {
name: 'test theme',
id: 'test-theme',
theme: {
'.text': {
'font-size': 14,'line-height': 1.5
}
}
}


Best regards,


Olivier

Hello Oliver,


thanks for the quick reply.


I believe that I already use MyScriptJS, at least I initialize my editor using:

this.editor = MyScriptJS.register(this.domEditor.nativeElement, {
      recognitionParams: {
        type: 'TEXT',
        protocol: 'WEBSOCKET',
        apiVersion: 'V4',
        server: {
          scheme: 'https',
          host: 'webdemoapi.myscript.com',
          applicationKey: 'xxxxx',
          hmacKey: 'xxxxxx'
        },
        v4: {
          lang: 'de_DE',
          text: {
            guides: {
              enable: true
            },
            smartGuide: true,
            smartGuideFadeOut: {
              enable: false,
              duration: 1000
            }
          }
        }
      }
    });

 

So could you please explain how I can change the theme? I don't think I have a customize_style.html file.


Thanks and kind regards,
Nico


Dear Nico,


you can find the customize_style.html sample in the "examples/v4" directory.


Just add my above code, it should work.


Best regards,


Olivier

Answer

Thanks again for the quick reply. It is working now. My only problem was that I was changing "innerTheme" instead of "theme". So my above changes as follows works well:

 

this.editor.theme= {'.text': {'font-size': 10, 'line-height': 1.5}};

 

Dear Nico,


thank you for the update, I am glad it is working.


Best regards,


Olivier