[project training 10] drawing of arrows

A common use SVG The drawing is an arrow . One line of code can create a , But the code is very repetitive . You can also be in <defs> and <symbol> And then reuse it , But you need to move or rotate it every time you apply it . Use one... Directly <marker> Element will facilitate the ownership of many copyrights by the author .

marker It is a method that can connect one or more path,line,polyline,polygon The flag type of the vertex of . The most common use case is to draw an arrow or mark a line on the output （polymarker） graphics .

Arrows are path Drawing .

marker The special feature of the is that they can adjust the direction according to the direction of the application object . No, right <marker> Make any adjustments to the contents of , The arrow automatically adjusts to and line In the same direction .

Can be set by maker-end, And maker-start Attach the arrow to the end or start point of the line

Example

end_arrow = std::make_shared<Lewzen::SVGIMarker>();
        end_arrow->Id = "end_arrow";
        end_arrow->MarkerHeight = 13;
        end_arrow->MarkerWidth = 13;
        end_arrow->RefX = 2;
        end_arrow->RefY = 3;
        end_arrow->Orient = "auto";
        arrowPath = std::make_shared<Lewzen::SVGIPath>();
        arrowPath->D = "M0,0 L6,3 L0,6 L2,3 L0,0";
        arrowPath->Fill = "black";
        end_arrow->add(arrowPath);

start_arrow = std::make_shared<Lewzen::SVGIMarker>();
        start_arrow->Id = "start_arrow";
        start_arrow->MarkerHeight = 13;
        start_arrow->MarkerWidth = 13;
        start_arrow->RefX = 2;
        start_arrow->RefY = 3;
        start_arrow->Orient = "auto";
        std::shared_ptr<Lewzen::SVGIPath> enda = std::make_shared<Lewzen::SVGIPath>();
        enda->D = "M4,3 L6,0 L0,3 L6,6 L4,3";
        enda->Fill = "black";
        start_arrow->add(enda);

By drawing correctly <maker> Internal elements , You can draw different types of arrows .

Among them orient, This attribute is why I am converting line In the direction of , There is no need to adjust marker Why . It accepts a auto value , Or an angle value , This value determines marker Do you want to rotate .

Set to auto , Indicates that the direction of the arrow is consistent with the direction of the end of the line .

refX,refY Represents the coordinates of the points connected with the graphic elements .