jqplot:我们如何在条形图中设置默认值

时间:2014-01-18 09:01:20

标签: jquery jqplot

我正在使用此代码创建条形图。

var plot1 = $.jqplot('fidtenuredivid', [line1], {
            title: '%%K_CATEGORY_VS_AMOUNT%%',
            animate: !$.jqplot.use_excanvas,
            seriesDefaults:{
            renderer:$.jqplot.BarRenderer,
            pointLabels: { show: true,
                      stackedValue: true},
            color: "#00749F"
        },
            axes: {
              xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
              }
            }
          });

但我希望它应该将黑色圆圈标记显示为每个类别的默认值。

1 个答案:

答案 0 :(得分:2)

可以实现。 Jsfiddle example

请在下面找到执行此操作的示例代码,您可以在代码中使用此概念。

 $(document).ready(function () {
    var defaults = [
        ['2014-01-15 15:10:01', 15],
        ['2014-01-15 15:10:12', 10],
        ['2014-01-15 15:10:14', 5],
        ['2014-01-15 15:10:17', 19],
        ['2014-01-15 15:10:23', 15],
        ['2014-01-15 15:10:28', 12]
    ];

    var bars = [
        ['2014-01-15 15:10:01', 21],
        ['2014-01-15 15:10:12', 21],
        ['2014-01-15 15:10:14', 22],
        ['2014-01-15 15:10:17', 21],
        ['2014-01-15 15:10:23', 22],
        ['2014-01-15 15:10:28', 18]
    ];

    var plot1 = $.jqplot('chart1', [bars, defaults], {
        title: 'Default Date Axis',
        axes: {
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
            }
        },
        series: [{
            renderer: $.jqplot.BarRenderer,
            pointLabels: {
                show: true,
                stackedValue: true
            },
            color: "#00749F",
            label: "peer expenses"
        }, {
            lineWidth: 1,
            showLine: false,
            markerOptions: {
                style: 'filledCircle',
                size: 40
            },
            label: "Expenses"
        }],
        legend: {
            show: true,
            location: 'e',
            placement: "outsideGrid"
        }
    });
});