如何向一条线上添加一个空心三角形箭头端？

Question

如何在 Raphael JS 中向直线添加空心三角形箭头端？
最接近它的是块宽长，但我想在里面做一个空的箭头。

var path_1 = paper.path('M10 50 L250 50');
path_1.attr({stroke:'#FF0000', 'stroke-width': 6 ,'arrow-end': 'block-wide-long'});

JSFiddle

Answer 1

来自raphael reference：

arrowhead on the end of the path. The format for string is < type >[-< width >[-< length >]]. Possible types: classic, block, open, oval, diamond, none, width: ...

所以另一个选择可能是 open。

var line = paper.path('M10 50 L250 50');
line.attr({stroke:'#FF0000', 'stroke-width': 6 ,'arrow-end': 'open-wide-long'});

看这里：http://jsfiddle.net/Ljoe1rpw/2/

如果您想使用空三角形，则必须修改 raphael 源代码。

Answer 2

我通过修改 raphael 库成功创建了开放三角形箭头。

3769线附近添加了一个标记：

 markers = {
        block: "M5,0 0,2.5 5,5z",
        **opentriangle: "M5,1 2,2.5 5,4z",**
        classic: "M5,0 0,2.5 5,5 3.5,3 3.5,2z",
        diamond: "M2.5,0 5,2.5 2.5,5 0,2.5z",
        open: "M6,1 1,3.5 6,6",
        oval: "M2.5,0A2.5,2.5,0,0,1,2.5,5 2.5,2.5,0,0,1,2.5,0z"
    },

近3907行修改while循环：

while (i--) {
            switch (values[i]) {
                case "block":
                **case "opentriangle":**
                case "classic":
                case "oval":
                case "diamond":
                case "open":
                case "none":
                    type = values[i];
                    break;
                case "wide": h = 5; break;
                case "narrow": h = 2; break;
                case "long": w = 5; break;
                case "short": w = 2; break;
            }
        }

4995行附近修改while循环：

while (i--) {
        switch (values[i]) {
            case "block":
            **case "opentriangle":**
            case "classic":
            case "oval":
            case "diamond":
            case "open":
            case "none":
                type = values[i];
                break;
            case "wide":
            case "narrow": h = values[i]; break;
            case "long":
            case "short": w = values[i]; break;
        }
    }

在第 3925 行附近添加了 else if 块：

 if (type == "open") {
            w += 2;
            h += 2;
            t += 2;
            dx = 1;
            refX = isEnd ? 4 : 1;
            attr = {
                fill: "none",
                stroke: attrs.stroke
            };
        } 
        **else if(type == "opentriangle"){
            w += 5;
            h += 5;
            dx = 7;
            refX = 0;
            attr = {
                fill: "none",
                stroke: attrs.stroke,
            };
        }**
        else {
            refX = dx = w / 2;
            attr = {
                fill: attrs.stroke,
                stroke: "none"
            };
        }

如何向一条线上添加一个空心三角形箭头端？

How can I add an open triangle arrow-end to a line?

javascript

raphael