Standalone Examples » Tooltips #2: placeholders

This is the usual way to add tooltips to your pie chart. In Tooltips #1 it shows you how to add a custom caption property to each data item for custom tooltips. This technique, however, just lets you define a single string containing placeholders: {value}, {label} and {percentage} which are replaced with their appropriate values. See the example below.

var pie = new d3pie("pie", {
  header: {
    title: {
      text: "Tooltips: example #2",
      fontSize: 20
    }
  },
  labels: {
    inner: {
      format: "none"
    }
  },
  data: {
    content: [
      { label: "JavaScript", value: 1 },
      { label: "Ruby", value: 2 },
      { label: "Java", value: 3 }
    ]
  },
  tooltips: {
    enabled: true,
    type: "placeholder",
    string: "{label}, {value}, {percentage}%"
  }
});