条形图上的JqPlot显示趋势线

绿洲

我使用下面的代码通过jqplot显示条形图。但是即使指定趋势线,我也无法在条形图上绘制趋势线:{show:true}

References I have used

    <script type="text/javascript" src="js/jqplot/jquery.jqplot.min.js"></script>
    <script type="text/javascript" src="js/jqplot/jqplot.barRenderer.min.js"></script>
    <script type="text/javascript" src="js/jqplot/jqplot.pieRenderer.min.js"></script>
    <script type="text/javascript" src="js/jqplot/jqplot.categoryAxisRenderer.min.js"></script>
    <script type="text/javascript" src="js/jqplot/jqplot.pointLabels.min.js"></script>
    <script type="text/javascript" src="js/jqplot/jqplot.canvasTextRenderer.min.js"></script>
    <script type="text/javascript" src="js/jqplot/jqplot.canvasAxisLabelRenderer.min.js"></script>
    <script type="text/javascript" src="js/jqplot/jqplot.dateAxisRenderer.min.js"></script>
    <link href="Css/blitzer/jquery-ui.css" rel="stylesheet" />
    <script src="Js/jqplot/jqplot.cursor.min.js"></script>
    <script src="Js/jqplot/jqplot.highlighter.min.js"></script>

Code:
 var AppleArray=[];
 var OrangeArray = [];
 var GrapeArray = [] ;
 var MangoArray =[];
 var PomegranateArray = [];
 var xAxisTicks =[];//It would be 00:01:03,02:01:03,04:01:04,06:01:04,08:01:04,10:01:03,12:01:03,14:01:03,16:01:06,18:01:04,20:01:05,22:01:08

 for(var Count = 0; Count < JsonResponse.length ;Count++)
 {
     //Fill the AppleArray,OrangeArray ,GrapeArray ,MangoArray ,Pomovalues from Json                  response
 }

 var TypeArray = [AppleArray, OrangeArray, GrapeArray, MangoArray, PomegranateArray];
 //Final TypeArray dynamic Value would be 1047,1049,1045,1046,1046,1046,1077,1048,1045,1046,1047,1045,669,717,742,696,1277,905,728,740,704,722,753,2127,1102,1079,1105,1070,1120,1095,1085,1077,1088,1139,1953,1452,1583,1649,1596,1587,1523,1539,2025,1653,1581,1797,2039,2012,1240,1219,1235,1203,1147,1289,1105,1194,1117,1209,1152,1208 
 plot1 = $.jqplot('chart1', TypeArray, {
    // Only animate if we're not using excanvas (not in IE 7 or IE 8)..
    animate: !$.jqplot.use_excanvas,
    seriesDefaults: {
        renderer: $.jqplot.BarRenderer,
        pointLabels: { show: true },
        trendline: {show: true},
    },
    legend: {
        renderer: $.jqplot.EnhancedLegendRenderer,
        labels: legendLabels,
        show: true
    },
    axes: {
        xaxis: {
            renderer: $.jqplot.CategoryAxisRenderer,
            rendererOptions: {
                seriesToggleReplot: { resetAxes: true },
                drawBaseline: false
            },
            ticks: xAxisTicks
        },
        yaxis: {
            //min : 500,
            min: 100,
            //tickInterval : 500,
            max: 2500
        }
    },
    highlighter: { show: false }
});

该代码仅显示下面的条形图。不显示条形图上的趋势线。如何在条形图上绘制趋势线?

安东尼·莱戈维奇

您需要包括Trendline插件才能使用它:

<script type="text/javascript" src="js/jqplot/jqplot.trendline.min.js"></script>
<script type="text/javascript" src="js/jqplot/jqplot.enhancedLegendRenderer.min.js"></script>

编辑:在这里查看一个工作示例

与您的代码的唯一区别在于,为了避免错误,我删除了legendLabels调用。数据数组是硬编码的。也许您的问题与您的数据创建(尤其是您的TypeArray)有关-TypeArray必须是数组的数组,而不是数组的数组。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

TOP 榜单

热门标签

归档