Question

我的JQPlot图表目前正确渲染所有内容，但唯一的问题是刻度标签与图表重叠。无论如何，我可以抵消标签，以防止这种情况发生或简单的选项更改？我在JQPlot网站上没有找到任何关于此的内容，所以任何帮助都将不胜感激。这是一些示例代码：

var moduleTypesChart = $.jqplot("moduleTypesChart",[moduleTypesCount], {
                            title:'<h2>Module Types Distribution</h2>',
                            seriesColors:["darkred"],
                            seriesDefaults:{
                                renderer:$.jqplot.BarRenderer,
                                rendererOptions: {fillToZero: true, varyBarColor: false}
                            },
                            axesDefaults:{
                                tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                                tickOptions:{
                                    angle: -15,
                                    textColor:'black',
                                    labelPosition:'middle',
                                    fontFamily:"Arial",
                                    fontWeight:"bold"
                                }
                            },
                            axes: {
                                xaxis: {
                                    renderer: $.jqplot.CategoryAxisRenderer,
                                    ticks: moduleTypes
                                }
                            },
                            grid: {
                                background:'Gainsboro',
                                gridLineColor:'LightSteelBlue'
                            }

Answer 1

您可以通过修改CSS来完成此操作。

在您的jqPlot目录中有两个文件：jquery.jqplot.css和jquery.jqplot.min.css

Inside是y轴标签的CSS类：

.jqplot-yaxis-label {
    margin-right: 20px;
    font-size: 11pt;
    position: absolute;
}

您可以增加右边距以避免与刻度重叠。

请务必确保链接到HTML文档头部的其中一个文件，例如：

<link rel='stylesheet' type='text/css' href='/DHTML/jqplot/jquery.jqplot.css'>

JQPlot Y轴标签偏移

1 个答案: