一个 Category 类型的横坐标用来显示日期
一个Numeric 类型的纵坐标用来显示数据
配置 column 类型的柱状图。
针对上面的例子, 坐标轴的长度是Extjs根据数据大小自动运算并设置的。
如果需要手动定义这个长度的话,改如何设置呢?
而且配置也很简单了, 就不多介绍了。
这里只是对红色的部分做一个伏笔(这种设置对于配置 堆叠的图形不使用)
有的状况下, 可能会使用多个图形,
因为图形的范围不同,可能需要使用两个纵坐标轴。
类似的情景可以是这样:
有三个图, 两个柱状图, 一个折线图
折线图和柱状图的数据范围或是单位可能不同。
这里看上去好像是一个折线图和一个柱状图。
其实是有两个柱状图, 只不过一个被另一个盖住了。
出现这种状况的原因是在定义的时候, 往series 中添加了两个column 的chart.
基本上这不是我们想要的效果。
我们要的效果应该是这样:
完美方式实现的思想是:
1 创建两个坐标轴, axes
一个 Category 类型的横坐标用来显示日期
一个Numeric 类型的纵坐标用来显示柱状图数据
一个Numeric 类型的纵坐标用来显示折线图数据
以上定义完成之后, 会发生基本上都正常, 但是有一点就是, 左右的两个纵坐标的尺度可能不同。
这里就要提到上面框出的maximum配置的红色部分了, 因为这个配置对于堆叠的图已经不适用了。
原来是这个地方有限制。这应该是Extjs 有意为之了, 至于原因是什么,尚不可知。
不管这样,先去除这个限制得到想要的效果。
这一段建议是单独放在一个js 文件中, 通过导入的方式使用。
下面给出一个放在同一份文件中完整的: