iink SDK on Device

Answered

Character rects are too small when exported to JIIX format(iOS SDK)


Dear Team,


The bounding box for each character from the editor after exporting into .JIIX format. Please check the attached screenshot that how we got the results. Can you help us with the solution for this please?


Regards,

Steve



image




Best Answer

Dear Steve,


While you provide input to the iink editor in screen units ("pixels"), iink SDK internally converts all data to mm and this is the unit used by the JIIX export.

You can map the values to pixels again using the view transform associated with your renderer object.


I hope this help,

Thomas


Answer

Dear Steve,


While you provide input to the iink editor in screen units ("pixels"), iink SDK internally converts all data to mm and this is the unit used by the JIIX export.

You can map the values to pixels again using the view transform associated with your renderer object.


I hope this help,

Thomas

Dear Thomas,

Thanks for the revert and it's working great for the SIZE if we apply the transform to the rect, but the Origin (x, y) is not getting the right value as shown in the Screenshot.

(You can see the yellow highlighted rects for the typed text, and we are expecting the same rects for the hand written text as we just written over the typed text. Currently you can see the incorrect CGRect values highlighted in red color )

Can you please guide us in getting the right origin points for each character rect?


Thanks


Regards,

Steve

image

Dear Steve,

I am surprised with the result you get. Do you do something like: topLeftPxl = renderer.viewTransform.apply(leftMm, topMm)?

Best regards,

Thomas

Dear Thomas,

We are using the below configuration for engine, and we really did not get about "topLeftPxl = renderer.viewTransform.apply(leftMm, topMm)?" that you asked.

We are using the transform when we store the character rectangle like below:

  

    func addNewCharacterRect(withDictionary rectInfo:Dictionary<String, Any>, transform:CGAffineTransform){

        var charRect = CGRect.init()

        charRect.origin.x = CGFloat((rectInfo["x"]! as! NSNumber).floatValue)

        charRect.origin.y = CGFloat((rectInfo["y"]! as! NSNumber).floatValue)

        charRect.size.width = CGFloat((rectInfo["width"]! as! NSNumber).floatValue)

        charRect.size.height = CGFloat((rectInfo["height"]! as! NSNumber).floatValue)

        var transformedRect = charRect.applying(transform)

 

 

 

    IINKConfiguration *conf = self.engine.configuration;
    double horizontalMarginMM = 0;
    double verticalMarginMM = 0;
    NSError *error;
    [conf setBoolean:@"export.jiix.text.chars" value:true error:&error];

    [conf setNumber:@"text.margin.top" value:verticalMarginMM error:nil];
    [conf setNumber:@"text.margin.bottom" value:verticalMarginMM error:nil];
    [conf setNumber:@"text.margin.left" value:horizontalMarginMM error:nil];
    [conf setNumber:@"text.margin.right" value:horizontalMarginMM error:nil];

    [conf setNumber:@"math.margin.top" value:verticalMarginMM error:nil];
    [conf setNumber:@"math.margin.bottom" value:verticalMarginMM error:nil];
    [conf setNumber:@"math.margin.left" value:horizontalMarginMM error:nil];
    [conf setNumber:@"math.margin.right" value:horizontalMarginMM error:nil]; 

  Please help us if we missed something here.


Thanks,

Steve

Dear Steve,

I wrote some quick code to position a rectangle (here a blue view) in the rendering view knowing its mm coordinates and applying the view transform. I use a Text backend, get margin and line spacing information in mm from the settings to place the view right below the first guide, aligned with the left margin.

Here is the code:

let topMm = editorViewController.engine.configuration.getNumber("text.margin.top", error: nil)
let leftMm = editorViewController.engine.configuration.getNumber("text.margin.left", error: nil)
let lineMm = 10.0
let mmRect = CGRect.init(x: leftMm, y: topMm + lineMm, width: 30.0, height: 10.0)
let transform = self.editorViewController.editor.renderer.viewTransform
let pxlRect = mmRect.applying(transform)
let coloredView = UIView(frame: pxlRect)
coloredView.backgroundColor = UIColor.blue
editorViewController.view.addSubview(coloredView)

And the result is as follows:

It looks indeed similar to what you are doing, but I don't know where you get your transform from, so there may be some details I do not see.

From your inking, I suspect that you do not use the MyScript rendering stack. Could you make sure that the renderer object associated with the MyScript editor is properly configured (right DPI values) and that you take its own transform into account when transforming from mm to the coordinate system you used to feed data into the editor? If you have your own transform on top of that (like if you have a zoom in your app), you may also need to apply it as well.

I hopes this helps.

Best regards,

Thomas


Dear Thomas,


Thanks a lot for the patience in helping us.

We are using part type as "Text Document" which is causing to the problem, and we got the perfect results when we start using part type "Text".


Thanks,

Steve