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)可以控制坐标平移到原点。而视窗在一开始就订好大小，在调整过程中最好不要更改视窗大小。