如何使百分比符号小于数字

How to make the percentage symbol smaller than the number?

本文关键字：小于 数字 符号 百分比 何使      更新时间：2023-09-26

我需要使"%"（百分比）符号小于数据系列标签的数字。 现在它们的大小相同。 请参阅我在此 jsfiddle 上的示例代码。

目前我有这个文本渲染代码，但它以62%渲染所有文本;我需要挑出"%"并使其更小。

// Render the text
chart4.renderer.text(chart4.series[0].data[0].percentage + '%', 44, 85).css({
    width: circleradius * 2,
    color: '#515151',
    fontSize: '32px',
    textAlign: 'right',
    fontFamily: 'Arial',
    fontWeight: 'bold'
})

从他们的文档中：

高图表中的 HTML

Highcharts中的文本和标签以HTML形式给出，但由于HTML在SVG中解析和呈现，因此仅支持子集。支持以下标记：<b>、<strong>、<i>、<em>、<br/>、<span> 。可以使用样式属性设置范围样式，但仅处理与 SVG 共享的文本相关 CSS。

因此，您可以在文本中使用<span>标签。

chart4.renderer.text( 
    chart4.series[0].data[0].percentage + 
    '<span style="font-size: 22px">%</span>', 44, 115).css({

它将任何支持的样式属性转换为相应的 SVG 代码。

HTML

代码&#65130;会给你一个较小的百分号：%。 它也是 unicode FE6A，如果你需要使用字符转换方法。

相关文章：