SVG Координатный перевод - PullRequest
Новая
       13

SVG Координатный перевод

0 голосов
/ 14 августа 2011

Почему этот встроенный код SVG не создает поле 60 на 40 с точкой в ​​середине?

Я хотел бы построить элементы на обычной карте декартовых координат, используя SVG.Данные, которые у меня были бы, были бы размером отображаемой карты и центральной точки на главной карте Декарта. 

<svg xmlns="http://www.w3.org/2000/svg" width="60" height="40" viewBox="0 0 60 40">
  <g transform="translate(-470,480) scale(1,-1)">
    <circle title="Center" cx="500" cy="500" r="3" fill="red"/>
  </g>
</svg>

Ответы [ 2 ]

4 голосов
/ 14 августа 2011

Ваш код создает SVG 60 на 40 пикселей, затем:

  • Рисует круг по центру (500, 500)
  • Преобразование шкалы перемещает круг к (500, -500)
  • Преобразование translate перемещает его в (30, -20)

Если вы измените преобразование на transform="translate(-470,520) scale(1,-1)", вы должны получить то, что я думаю, вы хотите.

2 голосов
/ 15 августа 2011

Я придумал этот фрагмент кода, который создаст карту с декартовыми координатами и построит их в окне SVG, используя эти координаты.Надеюсь, это кому-нибудь поможет.

Функция принимает центр карты как $ x, $ y и рисует карту вокруг этой координаты. 

    public static function xyMap( $x, $y, $width = 0, $height = 0, $show = array('X')) {

    $minx = $x - ($width / 2);
    $maxx = $x + ($width / 2);

    if ($minx < 0) {
        $minx = 0;
        $maxx = $width;
    } elseif ($maxx > Yii::app()->params['maxMapX']) {
        $maxx = Yii::app()->params['maxMapX'];
        $minx = Yii::app()->params['maxMapX'] - $width;
    }

    $miny = $y - ($height / 2);
    $maxy = $y + ($height / 2);

    if ($miny < 0) {
        $miny = 0;
        $maxy = $height;
    } elseif ($maxy > Yii::app()->params['maxMapY']) {
        $maxy = Yii::app()->params['maxMapY'];
        $miny = Yii::app()->params['maxMapY'] - $height;
    }


    $x_xform = -1 * $minx;
    $y_xform = $maxy;

    $x_scale = 1;
    $y_scale = -1;

    echo "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"$width\" height=\"$height\" viewBox=\"0 0 $width $height\">\n";
    echo "<g transform=\"translate($x_xform, $y_xform) scale($x_scale,$y_scale)\">\n";
    echo "<rect x=\"$minx\" y=\"$miny\" width=\"$width\" height=\"$height\" stroke=\"black\" stroke-width=\"2\" fill=\"white\" />\n";
    echo "<circle title=\"Center\" cx=\"$x\" cy=\"$y\" r=\"3\" fill=\"red\"/>\n";
    echo "</g>\n</svg>\n";

}
...