[c3.js]如何将鼠标单击/鼠标悬停在图例上,然后显示工具提示?

时间:2018-10-03 13:28:02

标签: javascript charts c3.js

我想单击或鼠标悬停在目标图例上,并使它显示工具提示,就像我们将鼠标悬停在饼图的一部分上一样。

一个问题是我有像这样的数据enter image description here 一些数据太小而难以通过鼠标移到目标上

PS。我禁止单击图例以显示/隐藏图表中的数据。

1 个答案:

答案 0 :(得分:2)

使用jQuery如下添加事件...

<nav class="navbar navbar-default" *ngIf="nav.visible" id="navProperties">
  <div class="container" id="navOne">

    <a class="navbar-brand" [routerLink]="['/dashboard']" class="SClogo">
      <img src="assets/sc-logo-no-background.png" style="width: 60px; margin-top:5px; padding-bottom:10px">

    </a>

    <breadcrumb prefix="App Title"></breadcrumb>

    <!-- PROFILE FOR MOBILE -->
    <div class="profileLeft">
      <div class="dropup">
        <div class="profileBubble">
          <p class="profileText">{{userInitial}}</p>
        </div>
        <div class="dropup-content">
          <a *ngIf="!authService.loggedIn()" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" [routerLink]="['/login']">Login</a>
          <a *ngIf="!authService.loggedIn()" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" [routerLink]="['/register']">Register</a>
          <a *ngIf="authService.loggedIn()" [routerLinkActive]="['active']" [routerLinkActiveOptions]="{exact:true}" [routerLink]="['/profile']">Profile</a>
          <a *ngIf="authService.loggedIn()" (click)="onLogoutClick()" href="#">Logout</a>
        </div>
      </div>
    </div>
  </div>
</nav>

http://jsfiddle.net/highcharts/5V33F/