d3-tip

d3 tooltips

Github stars Tracking Chart

d3.tip: Tooltips for d3.js visualizations

API Docs

See the API Documentation

Download Latest Version

Install with NPM

npm install d3-tip

Quick Usage

/* Initialize tooltip */
tip = d3.tip().attr('class', 'd3-tip').html(function(d) { return d; });

/* Invoke the tip in the context of your visualization */
vis.call(tip)

vis.selectAll('rect')
  .data(data)
  .enter()
  .append('rect')
  .attr('width', function() { return x.rangeBand() })
  .attr('height', function(d) { return h - y(d) })
  .attr('y', function(d) { return y(d) })
  .attr('x', function(d, i) { return x(i) })
  .on('mouseover', tip.show)
  .on('mouseout', tip.hide)

If you want basic styling, you can include example-styles.css using a service like
rawgithub.com.

<link rel="stylesheet" href="//rawgithub.com/Caged/d3-tip/master/examples/example-styles.css">

Overview

Name With Ownercaged/d3-tip
Primary LanguageJavaScript
Program languageMakefile (Language Count: 2)
Platform
License:MIT License
Release Count26
Last Release Namev0.9.1 (Posted on )
First Release Namev0.1.0 (Posted on )
Created At2012-01-07 22:22:34
Pushed At2020-02-16 23:36:24
Last Commit At2018-05-10 11:46:49
Stargazers Count1.2k
Watchers Count43
Fork Count356
Commits Count321
Has Issues Enabled
Issues Count137
Issue Open Count2
Pull Requests Count44
Pull Requests Open Count6
Pull Requests Close Count75
Has Wiki Enabled
Is Archived
Is Fork
Is Locked
Is Mirror
Is Private
To the top