Question

我想在morris.js条形图中格式化x标签。

请看这段代码： http://jsbin.com/uzosiq/258/embed?js,output

条形图示例中没有

xLabelFormat选项，该示例在https://morrisjs.github.io/morris.js/lines.html中的所有其他类型的图表中均可用但不在https://morrisjs.github.io/morris.js/bars.html

Answer 1

嗯，它没有在文档中指定，但你也可以使用xLabelFormat作为Morris条形图。

请运行此代码段以查看有效示例：

＆＃13;

var data = [
  { year: '2014', in: 10, out: 44, inOut: 54 },
  { year: '2015', in: 20, out: 55, inOut: 75 },
  { year: '2016', in: 50, out: 51, inOut: 101 }
],
config = {
  data: data,
  xkey: 'year',
  ykeys: ['in', 'out', 'inOut'],
  labels: ['Total Income', 'Total Outcome', 'Total In/Out'],
  resize: true,
  xLabelFormat: function (x) {
      return "Year [" + x.src.year + "]";
  },
  parseTime: false
};

config.element = 'bar-chart';
Morris.Bar(config);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.min.js"></script>
<link href="//cdnjs.cloudflare.com/ajax/libs/morris.js/0.5.1/morris.css" rel="stylesheet" />

<div id="bar-chart"></div>

＆＃13;

Morris.js Bar Charts无法格式化x标签

1 个答案: