Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix incorrect rendering when zoom-dependent text-size is used with icon-text-fit #5656

Open
anandthakker opened this issue Nov 11, 2017 · 0 comments
Labels

Comments

@anandthakker
Copy link
Contributor

Our current approach to icon-text-fit does not account for zoom-dependent text-size. We read the value of text-size during symbol layout:

const iconWidth = (right - left),
iconHeight = (bottom - top),
size = layout['text-size'] / 24,
textLeft = shapedText.left * size,
textRight = shapedText.right * size,
textTop = shapedText.top * size,
textBottom = shapedText.bottom * size,
textWidth = textRight - textLeft,
textHeight = textBottom - textTop,
padT = layout['icon-text-fit-padding'][0],
padR = layout['icon-text-fit-padding'][1],
padB = layout['icon-text-fit-padding'][2],
padL = layout['icon-text-fit-padding'][3],
offsetY = layout['icon-text-fit'] === 'width' ? (textHeight - iconHeight) * 0.5 : 0,
offsetX = layout['icon-text-fit'] === 'height' ? (textWidth - iconWidth) * 0.5 : 0,
width = layout['icon-text-fit'] === 'width' || layout['icon-text-fit'] === 'both' ? textWidth : iconWidth,
height = layout['icon-text-fit'] === 'height' || layout['icon-text-fit'] === 'both' ? textHeight : iconHeight;
tl = new Point(textLeft + offsetX - padL, textTop + offsetY - padT);
tr = new Point(textLeft + offsetX + padR + width, textTop + offsetY - padT);
br = new Point(textLeft + offsetX + padR + width, textTop + offsetY + padB + height);
bl = new Point(textLeft + offsetX - padL, textTop + offsetY + padB + height);

But, at render time, we don't scale the icon to match the text size at the current zoom level. For icon-text-size: both, we could solve this by disallowing the icon-size property to be set and just using the text-size data in the icon rendering pass.

I'm not sure what we should do to handle cases where icon-text-size is used in only one dimension, and icon-size is used for the other. Some permutations of this could be handled with an extra uniform, but, for example, {icon-text-size: 'width', icon-size: [... composite expression ...], text-size: [... another composite expression ...]} would entail providing additional vertex attribute data.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant