highcharts Highmaps飞行路线添加箭头

szqfcxe2 于 2022-11-10 发布在 Highcharts

关注(0)|答案(1)|浏览(254)

我正在使用Highmaps和新的topojson文件来创建一个可视化的飞行路线Map。它的工作很好，看演示在这里：https://jsfiddle.net/vegaelce/L2ogczjh/现在我需要在Map线上添加箭头来指示路线（从城市-〉到城市）。这个箭头应该在Map线的中间（或者刚好在到达Map点之前）。
我尝试使用以下片段在一个帖子中看到没有成功：

events: {
      load: function () {
        this.renderer
          .definition({
            tagName: 'marker',
            id: 'markerArrow',
            refY: 5,
            refX: 9,
            markerWidth: 11,
            markerHeight: 11,
            orient: 'auto',
            children: [{
              tagName: 'path',
              d: 'M 0 0 L 10 5 L 0 10 Z',
              fill: Highcharts.getOptions().colors[3],
              'stroke-width': 1,
              stroke: '#000000'
            }]
          });
      }
    }

你能帮我做那个吗？

highcharts

来源：https://stackoverflow.com/questions/71584805/highmaps-flight-routes-add-arrows

1条答案

按热度按时间

mrfwxfqh1#

在序列中，你可以用一个箭头来实现一个新的类型。可能的两种方法是，在路径中写一个箭头，或者画一条线并在CSS样式中添加marker-start: url(#tail);。

{
        type: 'mapline',
        colorAxis: false,
        name: 'Lines',
        color: 'black',
        data: [{
          name: 'line1',
          //path: 'M 0 0 L 10 5 L 0 10 Z',
                    path: 'M 10 10 L 30 10',
          lineWidth: 3,
                    color: 'black'
        }]
      }

赞(0）回复(0）举报 2022-11-10

我来回答

highcharts Highmaps飞行路线添加箭头

1条答案

相关问题

热门标签

最新问答