在迷你图条形图上添加图例和y轴值

Question

我正在制作迷你图条形图.到现在为止我能够绘制一个简单的条形图,这里是Jquery代码:

values = [0,8, 15, 10, 50, 25, 35, 70];
$('.sparkline').sparkline(values, {
    type: 'bar',
    height: '200px',
    barWidth: 20,
    barSpacing: 10,
    barColor: '#56aaff',
    zeroColor: '#000000',
    enableTagOptions: true,
    tagValuesAttribute: 'data-values',
    colorMap: ["red", "green", "blue", "yellow", "orange", "#f2f2f2", "maroon", "pink"]

});

HTML

<p>
<span class="sparkline">Loading...</span>
</p>

请参考JSFIDDLE的代码.

现在我想在每个栏上添加图例名称和y轴值,如下所示.

sun,mon,tue是图例,条形顶部白色的值是y轴值.

但我无法实现它.

任何帮助,将不胜感激.

Answer 1

我能做的就是指向迷你线的FAQ:http:
//omnipotent.net/jquery.sparkline/#s-faq

经常问的问题

为什么没有轴标签/标记？

迷你图旨在小到足以与文本行放在一起,以给出趋势或模式的快速印象,因此没有全尺寸图表的随身用品.从版本2.0开始,您可以将鼠标悬停在迷你图上以查看基础数据.