jQuery Sparklines - 堆积条形图中的工具提示

时间:2016-01-06 08:06:19

标签: sparklines

使用jQuery Sparklines v2.1.2,我正在创建堆积条形图

工具提示值正确显示。它为每个小块显示列名作为工具提示。我应该如何为每个小块自定义工具提示?

tooltipFormat: '{{offset:offset}} - {{value}}',
  tooltipValueLookups: {
    'offset': {
      0: 'India',
      1: 'France',
      2: 'USA'
    }

源代码位于:http://jsfiddle.net/Hj6fB/236/

1 个答案:

答案 0 :(得分:6)

如果您仍在寻找解决方案。

这对我有用https://groups.google.com/forum/#!topic/jquery-sparkline/XcigtHeVx3M

$('#StackedBarChart').sparkline([
      [1, 4, 2],
      [2, 3, 2],
      [3, 2, 2],
      [4, 1, 2]
    ], {
      type: 'bar',
      // Map the offset in the list of values to a name to use in the tooltip
      myPrefixes: ['USA', 'France','India'],
                tooltipFormatter: function(sp, options, fields) {
                    var format =  $.spformat('<div class="jqsfield"><span style="color: {{color}}">&#9679;</span> {{myprefix}} {{value}}</div>');
                    var result = '';
                    $.each(fields, function(i, field) {
                            field.myprefix = options.get('myPrefixes')[i];
                            result += format.render(field, options.get('tooltipValueLookups'), options);
                    })
                    return result;
                },

      height: "75px",
      barWidth: "30px",
    });

参见示例 http://jsfiddle.net/Hj6fB/241/