将 md-tooltip 添加到 SVG 图表? [英] Adding md-tooltip to a SVG chart?

问题描述

这是一个例子:

我想为每个矩形添加一个 .我能以某种方式做到吗?我说的是 Angular Material Tooltip，而不是其他工具提示的实现图书馆.

解决方案

尝试将其包裹在 div 中并应用 md-tooltip

<md-tooltip md-direction="right">{{status.description}}</md-工具提示><svg ><rect width="300" height="100" ></rect></svg>

这是有效的示例

This is an example:

<svg>
    <g ng-repeat="rect in rectList">
        <rect ng-attr-fill="rect.fill"
              ng-attr-x="rect.x"
              ng-attr-y="rect.y"
              ng-attr-width="rect.width"
              ng-attr-height="rect.height"></rect>
    </g>
</svg>

I want to add a <md-tooltip> to each of these rects. Can I do it somehow? I am talking about the Angular Material Tooltip specifically, not any other tooltip implementation from other libraries.

解决方案

Try to wrap it in a div and apply the md-tooltip

<div ng-repeat="status in statuses">
   <md-tooltip md-direction="right">
     {{status.description}}
    </md-tooltip>     
<svg >
   <rect width="300" height="100"   >
   </rect>          
</svg>
</div>

Here is the working Sample

这篇关于将 md-tooltip 添加到 SVG 图表?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！