6

I have arabic content which is compound of words like ضضضضضضض. I want to get the width of the first letter of a given word ( which is not the same as the width of an independent letter i.e. ض ).

I used getBoundingClientRect() method and tried to get the width , but it is giving the width of an independent character , not the compound one which's thiner than the returned value by getBoundingClientRect method

In the above word , the width of ض (first letter) given by getBoundingClientRect() is 16.109375 , but the character is compound one i.e. visibily it is truncated as you see. It is less than the given value.

I tried and got the EXACT(visible) width of first letter by subtracting width given getBoundingClientRect() by of first two characters and width of first character which would be 12px which is correct.

Is there any better method than this so that I can get exact visible width of every character like this in any word?

Assem
  • 11,574
  • 5
  • 59
  • 97
psp psph
  • 65
  • 5
  • 1
    I'm not familiar with the arabic language, but 'ض' is a single char according to javascript. `'ض'.charCodeAt(0)` returns 1590. This means that you cannot divide it into smaller pieces. Chars are atomic units in strings. There is also no way to determine the width of the first half of 'M' or any ASCII char. If you try do to that I guess you're out of luck. – dotcs Dec 21 '16 at 18:25
  • @dotcs : I have edited the description for a better understanding. I guess I explained it better now, you can check and help if you can – psp psph Dec 22 '16 at 08:04
  • 2
    @dotcs In Arabic, the glyph for a given letter will change based on the surrounding letters. He is asking how to find the actual width of the letter in its natural context, which is different from the width of the same letter in isolation. – PMV Dec 22 '16 at 18:19
  • @psppsph please check my answer – Assem Apr 03 '18 at 06:54

1 Answers1

3

You should know that the unicode of what you see is not the unicode stored. All letters in your example ضضضضضضض are stored as a standard Dhad ض \u0636 but shown as:

  1. ﺿ \ufebf (start)
  2. ﻀ \ufec0 (middle)
  3. ﺾ \ufebe (end)
  4. ﺽ \ufebd (independent)

So to get the real length, you should apply your length function on those representation unicodes.

Assem
  • 11,574
  • 5
  • 59
  • 97