marker

marker元素定义了在特定的<path>元素、<line>元素、<polyline>元素或者<polygon>元素上绘制的箭头或者多边标记图形。

用法

类别容器元素
允许的内容物任意数量、任意排序的下列元素:
动画元素
描述性元素
形状元素
结构化元素
渐变元素
<a>, <altGlyphDef>, <clipPath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignObject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view>

示例

源代码 输出结果
<?xml version="1.0"?>
<svg width="120" height="120" viewBox="0 0 120 120"
     xmlns="http://www.w3.org/2000/svg" version="1.1"
     xmlns:xlink="http://www.w3.org/1999/xlink">

    <defs>
        <marker id="Triangle"
                viewBox="0 0 10 10" 
                refX="1" refY="5"
                markerWidth="6" 
                markerHeight="6"
                orient="auto">
            <path d="M 0 0 L 10 5 L 0 10 z" />
	    </marker>
    </defs>

    <polyline points="10,90 50,80 90,20"
              fill="none" stroke="black" 
              stroke-width="2"
              marker-end="url(#Triangle)" />
</svg>

» marker.svg

属性

全局属性

专有属性

DOM 接口

该元素实现了SVGMarkerElement 接口。

浏览器兼容性

 
Feature Chrome Firefox (Gecko) IE Opera Safari
Basic support 1.0 1.5 (1.8) 9.0 9.0 3.0.4
 
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 3.0 1.0 (1.8) 未实现 (Yes) 3.0.4

该表格基于这些资源

文档标签和贡献者

标签: 
 此页面的贡献者: Sebastianz, fanxiaojie, fonglezen
 最后编辑者: Sebastianz,