无法将文本标签应用于轴

Question

我在正确标记以下jqPlot图表方面面临僵局，该图表在浏览器上呈现为：

该图表由以下代码生成，为简单起见，此处为简要说明：

<!-- All scripts and stylesheets included in HEAD -->
/jqplot/src/jquery.min.js
/jqplot/src/jquery.jqplot.min.js
/jqplot/src/jquery.jqplot.css

/jqplot/src/plugins/jqplot.dateAxisRenderer.min.js
/jqplot/src/plugins/jqplot.canvasAxisLabelRenderer.min.js
/jqplot/src/plugins/jqplot.canvasAxisTickRenderer.min.js
/jqplot/src/plugins/jqplot.canvasTextRenderer.min.js
/jqplot/src/plugins/jqplot.barRenderer.min.js

-

<div id='chart_0' style='width: 100%; height: 15em;'></div>
<script id='source' language='javascript' type='text/javascript'>
    $.jqplot('chart_0',
      [[[ 0, 1],[ 1, 0],[ 2, 3],[ 3, 2],
        [ 4, 2],[ 5, 2],[ 6, 1],[ 7, 2]
      ]],
    {
      axes: {
        xaxis: {
          min: 0,
          max: 15,
          tickInterval: 1,
          labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
          tickRenderer: $.jqplot.CanvasAxisTickRenderer,
        },
        yaxis: {
          min: 0,
          max: 5,
          tickInterval: 1,
          labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
          tickOptions: { formatString: "%d" },
        },
      },
      seriesDefaults: {
        renderer:$.jqplot.BarRenderer,
        rendererOptions: {
          barWidth: 10,
          fillToZero: true,
        }
      }
    });
</script>

---

在横轴上，图表标记数字序列[0, 1, ..., 15]。 相反，我希望它以["Monday", "Tuesday", "Yesterday", "Today"]。

的形式标记一组自定义字符串

我尝试了几种方法，包括修改数据集

$.jqplot('chart_0',
  [[ [ 0, 2],[ 1, 5],[ 2, 2],[ 3, 0],
     [ 4, 2],[ 5, 2],[ 6, 1],[ 7, 2] ]],

到

$.jqplot('chart_0',
  [[ [ "Monday", 2],[ "Yesterday", 5],[ "Today", 2],["etc...", 0] ]],

但我得到的只是没有竖条或根本没有图表。
我正在使用jqPlot 1.0.8。

Answer 1

您需要使用categoryAxisRenderer。这是一个很好的example。

本质：

$.jqplot('chart_0',
  [[[ 0, 1],[ 1, 0],[ 2, 3],[ 3, 2],
    [ 4, 2],[ 5, 2],[ 6, 1],[ 7, 2]
  ]],
{
  axes: {
     xaxis: {
         renderer: $.jqplot.CategoryAxisRenderer,
         ticks: ['Monday','Yesterday','Today', etc...]
     }
 },