SVG参考手册
分类 | Elements
marker
该<marker>元素定义了图形将要被用于绘制箭头或polymarkers给定上<path>，<line>，<polyline>或<polygon>元件。
用法上下文
分类 |
容器元素 |
|---|---|
允许的内容 |
任意数量的下列元素，以任何顺序排列：动画元素描述元素图形元素结构元素渐变元素<a>, <altGlyphDef>, <clipPath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignObject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> |
属性
全局属性
- Core attributes »
- Presentation attributes »
class
style
externalResourcesRequired
viewBox
preserveAspectRatio
transform
具体属性
markerUnits
refX
refY
markerWidth
markerHeight
orient
DOM接口
这个元素实现了SVGMarkerElement接口。
例子
SVG
<?xml version="1.0"?>
<svg width="120" height="120" viewBox="0 0 120 120"
xmlns="http://www.w3.org/2000/svg" version="1.1">
<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>结果
产品规格
Specification |
Status |
Comment |
|---|---|---|
SVG MarkersThe definition of '<marker>' in that specification. |
Working Draft |
|
Scalable Vector Graphics (SVG) 2The definition of '<marker>' in that specification. |
Candidate Recommendation |
|
Scalable Vector Graphics (SVG) 1.1 (Second Edition)The definition of '<marker>' in that specification. |
Recommendation |
Initial definition |
浏览器兼容性
Feature |
Chrome |
Edge |
Firefox (Gecko) |
IE |
Opera |
Safari |
|---|---|---|---|---|---|---|
Basic support |
1.0 |
(Yes) |
1.5 (1.8) |
9.0 |
9.0 |
3.0.4 |
Feature |
Android |
Edge |
Firefox Mobile (Gecko) |
IE Phone |
Opera Mobile |
Safari Mobile |
|---|---|---|---|---|---|---|
Basic support |
3.0 |
(Yes) |
1.0 (1.8) |
No support |
(Yes) |
3.0.4 |
加载中,请稍侯......