123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361 |
- describe('series.bar', function () {
- var uiHelper = window.uiHelper;
- var defaultOption = {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: {
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310]
- }
- };
- // get a clone of default option
- var getOption = function () {
- return JSON.parse(JSON.stringify(defaultOption));
- };
- var suites = [{
- name: 'bar color',
- cases: [{
- name: 'should display default bar color',
- test: 'equalOption',
- option1: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310]
- }, {
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310]
- }]
- },
- option2: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- itemStyle: {
- normal: {
- color: '#c23531'
- }
- }
- }, {
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- itemStyle: {
- normal: {
- color: '#2f4554'
- }
- }
- }]
- }
- }]
- }, {
- name: 'border color',
- cases: [{
- name: 'should have default border color',
- ignore: true,
- test: 'equalOption',
- option1: (function () {
- var option = getOption();
- option.series.itemStyle = {
- normal: {
- borderWidth: 1
- }
- }
- return option;
- })(),
- option2: (function () {
- var option = getOption();
- option.series.itemStyle = {
- normal: {
- borderColor: '#000',
- borderWidth: 1
- }
- }
- return option;
- })()
- }]
- }, {
- name: 'border width',
- cases: [{
- name: 'should have default width',
- test: 'equalOption',
- option1: getOption(),
- option2: (function () {
- var option = getOption();
- option.series.itemStyle = {
- normal: {
- borderWidth: 0
- }
- }
- return option;
- })()
- }, {
- name: 'can be set to other width',
- test: 'notEqualOption',
- option1: (function () {
- var option = getOption();
- option.series.itemStyle = {
- normal: {
- borderWidth: 10,
- borderColor: 'red'
- }
- }
- return option;
- })(),
- option2: getOption()
- }]
- }, {
- name: 'opacity',
- cases: [{
- name: 'can be set to other opacity',
- test: 'notEqualOption',
- option1: (function () {
- var option = getOption();
- option.series.itemStyle = {
- normal: {
- opacity: 0.8
- }
- }
- return option;
- })(),
- option2: getOption()
- }]
- }, {
- name: 'stack',
- cases: [{
- name: 'should stack properly',
- test: 'notEqualOption',
- option1: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- stack: 'a'
- }, {
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- stack: 'a'
- }]
- },
- option2: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310]
- }, {
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310]
- }]
- }
- }]
- }, {
- name: 'barMaxWidth',
- cases: [{
- name: 'should work for pixels',
- test: 'equalOption',
- option1: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barMaxWidth: 10
- }]
- },
- option2: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barWidth: 10
- }]
- }
- }, {
- name: 'should work for percentage',
- option: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barMaxWidth: '10%'
- }]
- }
- }, {
- name: 'should take effect when barWidth is larger than barMaxWidth',
- test: 'equalOption',
- option1: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barWidth: 15,
- barMaxWidth: 10
- }]
- },
- option2: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barMaxWidth: 10
- }]
- }
- }, {
- name: 'should not take effect when barWidth is less than '
- + 'barMaxWidth',
- test: 'notEqualOption',
- option1: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barWidth: 5,
- barMaxWidth: 10
- }]
- },
- option2: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barMaxWidth: 10
- }]
- }
- }, {
- name: 'should not take effect when barMaxWidth is larger than '
- + 'default',
- test: 'equalOption',
- option1: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barMaxWidth: 100
- }]
- },
- option2: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310]
- }]
- }
- }, {
- name: 'should work with stack',
- test: 'notEqualOption',
- option1: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barMaxWidth: 10,
- stack: 'a'
- }, {
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- stack: 'a'
- }]
- },
- option2: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- stack: 'a'
- }, {
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- stack: 'a'
- }]
- }
- }, {
- name: 'should use the last value when stack',
- test: 'equalOption',
- option1: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barMaxWidth: 10,
- stack: 'a'
- }, {
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barMaxWidth: 20,
- stack: 'a'
- }]
- },
- option2: {
- xAxis: {
- data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
- },
- yAxis: {},
- series: [{
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- barMaxWidth: 20,
- stack: 'a'
- }, {
- type: 'bar',
- data: [220, 182, 191, 234, 290, 330, 310],
- stack: 'a'
- }]
- }
- }]
- }];
- uiHelper.testOptionSpec('series.bar', suites, true);
- });
|