如何将数字正确转换为折线点
How to convert numbers properly into polyline points
我需要在折线点中填写数据,问题是我代表每个数据集的数据不能超过120。
如果我有这些数字
5000
5320
5400
5100
4950
4850
我需要将它们放入最大应为 120 且最小应为 0 的折线点中。
我该怎么做,我想过不同的方法来做到这一点,如下所示:
$total = "The Total Value Of All Datasets"
$row['value'] = "The Value Of The Current Dataset";
$point = ceil (($row['value'] / $total) * 1200);
上面的例子会呈现非常接近的数字,这并不理想,因为我需要最大的代表 120,最小的代表 0,其他的代表介于两者之间的数字。
SVG 和折线的静态示例
<svg viewBox="0 0 500 100" class="mktcap_spark">
<polyline
fill="none"
stroke="#e9be3d"
stroke-width="8"
points="
00,120
20,60
40,120
60,10
80,80
100,80
120,60
140,100
160,90
180,80
200, 110
220, 10
240, 70
260, 100
280, 100
300, 40
320, 0
340, 100
360, 100
380, 120
400, 60
420, 70
440, 80
460, 20
480, 50
500, 30
"
/>
</svg>
渲染这个
找到最小值和最大值$xMin, $xMax
,然后使用线性映射
$newX = 120 * ($X - $xMin) / ($xMax - $xMin)
我需要在折线点中填写数据,问题是我代表每个数据集的数据不能超过120。
如果我有这些数字
5000 5320 5400 5100 4950 4850
我需要将它们放入最大应为 120 且最小应为 0 的折线点中。 我该怎么做,我想过不同的方法来做到这一点,如下所示:
$total = "The Total Value Of All Datasets"
$row['value'] = "The Value Of The Current Dataset";
$point = ceil (($row['value'] / $total) * 1200);
上面的例子会呈现非常接近的数字,这并不理想,因为我需要最大的代表 120,最小的代表 0,其他的代表介于两者之间的数字。
SVG 和折线的静态示例
<svg viewBox="0 0 500 100" class="mktcap_spark">
<polyline
fill="none"
stroke="#e9be3d"
stroke-width="8"
points="
00,120
20,60
40,120
60,10
80,80
100,80
120,60
140,100
160,90
180,80
200, 110
220, 10
240, 70
260, 100
280, 100
300, 40
320, 0
340, 100
360, 100
380, 120
400, 60
420, 70
440, 80
460, 20
480, 50
500, 30
"
/>
</svg>
渲染这个
找到最小值和最大值$xMin, $xMax
,然后使用线性映射
$newX = 120 * ($X - $xMin) / ($xMax - $xMin)