bezoerb / text-metrics

An efficient text measurement set for the browser
MIT License
63 stars 4 forks source link

Computes lines with one very long word #2

Open arnaud-zg opened 6 years ago

arnaud-zg commented 6 years ago

I think it could be cool to split a word by length when it's too long. The idea will be to split a long word each part should have given maximum number of characters.

For example if we use lines method on a string like this Craspharetrapharetragravida.Vivamusconsequatlacusvelposuerecongue.Duisaloremvitaeexauctorscelerisquenoneuturpis.Utimperdietmagnasitametjustobibendumvehicula..

Actually it returns the same string, with the option wordwrap it should return something like the example just below.

[
        'Craspharetraphar-',
        'retragravida.Vivam-',
        'musconsequatlac-',
        'cusvelposuerecon-',
        'ngue.Duisaloremv-',
        'vitaeexauctorscel-',
        'lerisquenoneutur-',
        'rpis.Utimperdietma-',
        'agnasitametjustob-',
        'bibendumvehicul-',
        'la.'
]
bezoerb commented 6 years ago

When the css rule word-break: break-all; is defined for the element you'll get

[ 'Craspharetraph',
  'aretragravida.Vi',
  'vamusconsequ',
  'atlacusvelposu',
  'erecongue.Duis',
  'aloremvitaeexa',
  'uctorscelerisqu',
  'enoneuturpis.Ut',
  'imperdietmagn',
  'asitametjustobi',
  'bendumvehicul',
  'a.' ]

This rule can also be enforced by adding style overwrites to the method call like this:

textMetrics(el).lines(text, {}, {'word-break': 'break-all'});
iakovoszournatzis commented 4 years ago

I have tried a similar situation with overflow-wrap: break-word; but without any luck. My "VeryVeryVeryVeryVeryLongText" doesn't break. Any ideas?

bezoerb commented 4 years ago

Sorry for the late reply. I totally missed this issue. overflow-wrap is currently not supported. Thanks for reporting. I‘ll try to add support in the next days.

bezoerb commented 4 years ago

seems a bit more complicated than i thought ;)