css - 更改节点悬停时的光标外观

Question

我使用 Angular 7 中的 ngx-graph 库来显示层次结构图。我的设置如下所示：

<ngx-graph *ngIf="(tree$ | async) as tree" style="width: 100%; height: 100%; display: grid"
           [links]="tree.links"
           [nodes]="tree.nodes"
           [curve]="curve"
           [draggingEnabled]="false"
           [panningEnabled]="panningEnabled"
           [enableZoom]="zoomEnabled"
           [zoomSpeed]="zoomSpeed"
           [minZoomLevel]="minZoomLevel"
           [maxZoomLevel]="maxZoomLevel"
           [panOnZoom]="panOnZoom"
           [orientation]="orientation"
           [autoZoom]="autoZoom"
           [autoCenter]="true"
           [update$]="update$"
           [center$]="center$"
           [zoomToFit$]="zoomToFit$"
           (select)="selected($event)" xmlns:svg="http://www.w3.org/1999/XSL/Transform">
  <ng-template #nodeTemplate let-node>
    <ng-container style="cursor: pointer">
    <svg:g class="node">
      <svg:circle [attr.r]="node.width/2" [attr.cx]="node.width/2" [attr.cy]="node.width/2" [attr.fill]="node.color || node.options.color" />
      <svg:text alignment-baseline="central" [attr.x]="10" [attr.y]="node.height / 2">{{node.label}}</svg:text>
    </svg:g>
    </ng-container>
  </ng-template>
</ngx-graph>

我试图在 ngx-graphs 代码的 let-node 之间放置一些东西，使用 ng-container 来不破坏模板层次结构，并在 svg 周围使用 cursor 属性包装样式，但它没有帮助。

替代方案是什么？我根本找不到与该问题相关的任何内容，ngx-graphs 的文档似乎不完整且奇怪。

Answer 1

这可以在 CSS 中完成。此示例将鼠标悬停在节点上时将光标更改为指针。

g.node rect,text {
  cursor: pointer;
}