Могу ли я установить активную ширину для ngx-tooltip на ребре / ссылке?

Question

Я хочу использовать ngx-tooltip на ребре между двумя узлами. ntx-tooltip works works find как для ребер, так и для узлов, просто ребро намного меньше, поэтому мышь нужно точно позиционировать, чтобы вызвать всплывающую подсказку.

<ng-template #linkTemplate let-link>
  <svg:g class="edge"
    ngx-tooltip
    [tooltipPlacement]="'top'"
    [tooltipType]="'popover'"
    [tooltipTitle]="link.direction"
  >
    <ng-container [ngSwitch]="link.direction">
      <svg:path
        *ngSwitchCase="'ToFrom'"
        [ngStyle]="pathStyle(link.source, link.target, link.direction)"
        class="line"
        stroke-width="3"
        marker-start="url(#arrow)"
        marker-end="url(#arrow)"
      >
      </svg:path>
      <svg:path
        *ngSwitchCase="'FromOnly'"
        [ngStyle]="pathStyle(link.source, link.target, link.direction)"
        class="line"
        stroke-width="3"
        marker-start="url(#EndMarker)"
        marker-end="url(#arrow)"
      >
      </svg:path>
      <svg:path
        *ngSwitchCase="'ToOnly'"
        [ngStyle]="pathStyle(link.source, link.target, link.direction)"
        class="line"
        stroke-width="3"
        marker-start="url(#arrow)"
        marker-end="url(#EndMarker)"
      >
      </svg:path>
    </ng-container>
    <svg:text class="edge-label" text-anchor="middle">
      <svg:textPath class="text-path" [attr.href]="'#' + link.id"
        [style.dominant-baseline]="link.dominantBaseline" startOffset="50%"
      >
        {{link.label}}
      </svg:textPath>
    </svg:text>
  </svg:g>
</ng-template>

Answer 1

Я бы добавил в шаблон невидимую линию, чтобы сделать область наведения мыши толще:

<svg:path class="invisible-line" [attr.d]="link.line"></svg:path>

А затем стилизуйте его так (обводка делает толщину 12 пикселей невидимой):

.invisible-line {
  stroke-width: 12px;
  stroke: rgba(0, 0, 0, 0.001);
}