svg 坐标换算

两次平移和scale

translate(A,B) scale(C,D)

translate(E,F) scale(G,H)

 

转换后落在原始坐标X=(X*g+E)*C+A

转换后落在原始坐标Y=(Y*H+F)*D+B

 

<?xml version="1.0" encoding="UTF-8" standalone="no"?>

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"

"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-flat-20030114.dtd">

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1082 768" width="100%" height="100%" >

 

<svg id="map" x="20" y="0" width="1060" height="768" viewBox="0 0 100000 100000" preserveAspectRatio="xMinYMin">

 

        <g id="factory" fill="white" stroke="red" transform="translate(100000,100000) scale(1,-1)">

 

               <g id="油田字" transform="translate(-5071214,21709192) scale(1,-1)" stroke="none" fill="black" font-family="Simsun" font-size="1500" visibility="visible">

 

                   <circle cx="5035902" cy="21709192" r="10000" stroke="black" stroke-width="2" fill="blue"/>

                      <text x="5035902" y="17099489">77</text> 

                      <text x="5070947" y="21689310">10B10</text> 

                      <text x="5061121" y="21676624">10B39-1</text> 

                      <text x="5059349" y="21677175">10B39-2</text> 

                      <text x="5071214" y="21708644">10C1</text> 

                      <text x="5063962" y="21697881">10C100-10</text> 

                      <text x="5069848" y="21709192">10C100-100</text> 

            </g>

 

   </g>

      

 </svg>

</svg>

 

可以用最外层的translate(A,B) 来调整位置到合适的视窗中。而里面的translate(A,B)可以控制坐标平移到原点。而视窗在一开始就订好大小,在调整过程中最好不要更改视窗大小。

参与评论 您还未登录,请先 登录 后发表或查看评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
©️2022 CSDN 皮肤主题:大白 设计师:CSDN官方博客 返回首页

打赏作者

yangxjn

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额:-- )
扫码支付
扫码支付:¥2
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值