在小尺寸 div 容器中绘制 jqPlot 条形图

Question

我想绘制一个简单的 jqplot 条形图。

但是图表必须是固定尺寸，而且尺寸很小[70x50 px].

我正在 div 中绘制图表并且 div 有一个 固定的 css 由于指定的项目我无法更改 要求。

这是正在应用的css

.task_brk_bar_chart {
    width:10%;
    float:left;
    border: 2px solid red;
    padding:10px 30px 10px 15px;
}

当我在这么小的区域绘制图表时，它被搞砸了，无法查看

我创建了一个 fiddle 显示相同的

那么如何在这么小的区域内绘制条形图呢？

我不需要 x/y 轴的图例，只需要条形图，任何帮助表示赞赏

Answer 1

我不是 100% 确定这是否是您要查找的内容，但我认为这是您的问题：

您需要为容器指定高度

.task_brk_bar_chart {
   width:10%;
   float:left;
   border: 2px solid red;
   padding:10px 30px 10px 15px;
   height: 70px;

}

另外我会隐藏标签

.jqplot-xaxis-tick{ display: none}

您容器中的填充，我们应该为 0 才能看到您要查找的结果。

padding:0;

并在 jqPlot 选项中更改以下参数

barWidth: 10,

希望对你有所帮助

Plot jqPlot bar chart in small size div container