Config show more as a prop, use component's width to show/hide show more button

[Dananji]

Related issue: #762

The calculation for truncating longer annotation texts uses a temporary Canvas object to calculate average character width based on font, fontSize, and clientWidth of the annotation text HTML div element for the given annotation text.
Using this average character width, the code calculates the maximum number of characters the div can display without exceeding the textLineLimit value given in the props.

This feature can be turned ON/OFF by using the value of showMoreSettings: { enableShowMore: false, textLineLimit: 6 } prop passed into MarkersDisplay component at the time of initialization.

Maximum number of characters to show for truncation of the text is calculated as follows to account the discrepancies around the spaces at of line breaks within text display;

const maxCharactersToShow = charsPerLine * (MAX_LINES - 1) +  Math.floor(charsPerLine / 2);

With this calculation the display text line length doesn't exceed the given value to the prop textLineLimit when the component is initialized.

With the fixes around the calculations for the multi line shorter texts in an Annotation the texts are displayed as follows;