如何翻转我的jqPlot图表

Question

如何翻转我的jqPlot图表

4

我正在使用jqPlot绘制图表，在我的模板中，我设计了一个向下增长的图表，从顶部向下翻转条形图，这取决于数据库中的一些输入。我想乘以-1，但似乎不起作用。

有什么建议吗？这是我的代码。

$(document).ready(function(){ $.jqplot.config.enablePlugins = true; var c0 = ""; var c1 = ""; var c2 = ""; var c3 = ""; var c4 = ""; var c5 = ""; var c6 = ""; var c7 = ""; var c8 = ""; var c9 = "";

                var a0 = "<?php echo $numArticles[0]?>";
                var a1 = "<?php echo $numArticles[1]?>";
                var a2 = "<?php echo $numArticles[2]?>";
                var a3 = "<?php echo $numArticles[3]?>";
                var a4 = "<?php echo $numArticles[4]?>";
                var a5 = "<?php echo $numArticles[5]?>";
                var a6 = "<?php echo $numArticles[6]?>";
                var a7 = "<?php echo $numArticles[7]?>";
                var a8 = "<?php echo $numArticles[8]?>";
                var a9 = "<?php echo $numArticles[9]?>";

                var s1 = [a0, a1, a2, a3, a4, a5,a6,a7,a8,a9];
                var ticks = [c0, c1,c2,c3,c4,c5,c6,c7,c8,c9];
                plot1 = $.jqplot('chart1', [s1], {
                    // Only animate if we're not using excanvas (not in IE 7 or IE 8)..
                    animate: !$.jqplot.use_excanvas,
                    seriesDefaults:{
                        shadow: false,
                        renderer:$.jqplot.BarRenderer,
                        pointLabels: { show: true }
                    },
                    axes: {
                        xaxis: {
                            renderer: $.jqplot.CategoryAxisRenderer,
                            ticks: ticks,
                            showTickMarks:false
                        },
                        yaxis: {
                            renderer: $.jqplot.CategoryAxisRenderer,
                            ticks: ticks,
                            showTicks: false        // same options as axesDefaults
                        }
                    },

                grid: {
                drawGridLines: false,       // wether to draw lines across the grid or not.
                gridLineColor: '#0d1c26',   // *Color of the grid lines.
                background: 'transparent',  // CSS color spec for background color of grid.
                borderColor: '#122934',     // CSS color spec for border around grid.
                borderWidth: 0,             // pixel width of border around grid.
                shadow: false               // draw a shadow for grid.
                                            // CanvasGridRenderer takes no additional options.
            },
                    seriesColors: [ "#0a3b4c"],     
                    highlighter: { show: false }
                });

                $('#chart1').bind('jqplotDataClick', 
                    function (ev, seriesIndex, pointIndex, data) {
                        $('#info1').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data);
                    }
                );
            });
            </script>

- Ando

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- frnhr · Answer 1

编辑：
这个答案只适用于PieRenderer，而不是问题中使用的BarRenderer。

不确定翻转，但也许将“startAngle”设置为180可以解决问题？

            plot1 = jQuery.jqplot ('chart1', [data],
            {
                seriesDefaults: {
                    renderer: jQuery.jqplot.PieRenderer,
                    rendererOptions: {
                        startAngle : 180
                    }
                },
                ... other stuff ...
            }

其他渲染器选项供参考：http://www.jqplot.com/docs/files/plugins/jqplot-pieRenderer-js.html