| /* | |
| * Licensed to the Apache Software Foundation (ASF) under one | |
| * or more contributor license agreements. See the NOTICE file | |
| * distributed with this work for additional information | |
| * regarding copyright ownership. The ASF licenses this file | |
| * to you under the Apache License, Version 2.0 (the | |
| * "License"); you may not use this file except in compliance | |
| * with the License. You may obtain a copy of the License at | |
| * | |
| * http://www.apache.org/licenses/LICENSE-2.0 | |
| * | |
| * Unless required by applicable law or agreed to in writing, | |
| * software distributed under the License is distributed on an | |
| * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY | |
| * KIND, either express or implied. See the License for the | |
| * specific language governing permissions and limitations | |
| * under the License. | |
| */ | |
| import { EChartsType } from '@/src/echarts'; | |
| import { createChart, getECModel } from '../../core/utHelper'; | |
| import { ComponentMainType, ParsedValue } from '@/src/util/types'; | |
| import SeriesModel from '@/src/model/Series'; | |
| import ComponentModel from '@/src/model/Component'; | |
| import ChartView from '@/src/view/Chart'; | |
| import { EChartsOption } from '@/src/export/option'; | |
| type OriginModelView = { | |
| model: SeriesModel; | |
| view: ChartView; | |
| }; | |
| describe('modelAndOptionMapping', function () { | |
| function getData0(chart: EChartsType, seriesIndex: number): ParsedValue { | |
| return getSeries(chart, seriesIndex).getData().get('y', 0); | |
| } | |
| function getSeries(chart: EChartsType, seriesIndex: number): SeriesModel { | |
| return getECModel(chart).getComponent('series', seriesIndex) as SeriesModel; | |
| } | |
| function getModel(chart: EChartsType, type: ComponentMainType, index: number): ComponentModel { | |
| return getECModel(chart).getComponent(type, index); | |
| } | |
| function countSeries(chart: EChartsType): number { | |
| return countModel(chart, 'series'); | |
| } | |
| function countModel(chart: EChartsType, type: ComponentMainType): number { | |
| // FIXME | |
| // access private | |
| // @ts-ignore | |
| return getECModel(chart)._componentsMap.get(type).length; | |
| } | |
| function getChartView(chart: EChartsType, series: SeriesModel): ChartView { | |
| // @ts-ignore | |
| return chart._chartsMap[series.__viewId]; | |
| } | |
| function countChartViews(chart: EChartsType): number { | |
| // @ts-ignore | |
| return chart._chartsViews.length; | |
| } | |
| function saveOrigins(chart: EChartsType): OriginModelView[] { | |
| const count = countSeries(chart); | |
| const origins = []; | |
| for (let i = 0; i < count; i++) { | |
| const series = getSeries(chart, i); | |
| origins.push({ | |
| model: series, | |
| view: getChartView(chart, series) | |
| }); | |
| } | |
| return origins; | |
| } | |
| function modelEqualsToOrigin( | |
| chart: EChartsType, | |
| idxList: number[], | |
| origins: OriginModelView[], | |
| boolResult: boolean | |
| ): void { | |
| for (let i = 0; i < idxList.length; i++) { | |
| const idx = idxList[i]; | |
| expect(origins[idx].model === getSeries(chart, idx)).toEqual(boolResult); | |
| } | |
| } | |
| function viewEqualsToOrigin( | |
| chart: EChartsType, | |
| idxList: number[], | |
| origins: OriginModelView[], | |
| boolResult: boolean | |
| ): void { | |
| for (let i = 0; i < idxList.length; i++) { | |
| const idx = idxList[i]; | |
| expect( | |
| origins[idx].view === getChartView(chart, getSeries(chart, idx)) | |
| ).toEqual(boolResult); | |
| } | |
| } | |
| let chart: EChartsType; | |
| beforeEach(function () { | |
| chart = createChart(); | |
| }); | |
| afterEach(function () { | |
| chart.dispose(); | |
| }); | |
| describe('idNoNameNo', function () { | |
| it('sameTypeNotMerge', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22]}, | |
| {type: 'line', data: [33]} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| // Not merge | |
| const origins = saveOrigins(chart); | |
| chart.setOption(option, true); | |
| expect(countChartViews(chart)).toEqual(3); | |
| expect(countSeries(chart)).toEqual(3); | |
| modelEqualsToOrigin(chart, [0, 1, 2], origins, false); | |
| viewEqualsToOrigin(chart, [0, 1, 2], origins, true); | |
| }); | |
| it('sameTypeMergeFull', function () { | |
| chart.setOption({ | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22]}, | |
| {type: 'line', data: [33]} | |
| ] | |
| }); | |
| // Merge | |
| const origins = saveOrigins(chart); | |
| chart.setOption({ | |
| series: [ | |
| {type: 'line', data: [111]}, | |
| {type: 'line', data: [222]}, | |
| {type: 'line', data: [333]} | |
| ] | |
| }); | |
| expect(countSeries(chart)).toEqual(3); | |
| expect(countChartViews(chart)).toEqual(3); | |
| expect(getData0(chart, 0)).toEqual(111); | |
| expect(getData0(chart, 1)).toEqual(222); | |
| expect(getData0(chart, 2)).toEqual(333); | |
| viewEqualsToOrigin(chart, [0, 1, 2], origins, true); | |
| modelEqualsToOrigin(chart, [0, 1, 2], origins, true); | |
| }); | |
| it('sameTypeMergePartial', function () { | |
| chart.setOption({ | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22]}, | |
| {type: 'line', data: [33]} | |
| ] | |
| }); | |
| // Merge | |
| const origins = saveOrigins(chart); | |
| chart.setOption({ | |
| series: [ | |
| {data: [22222]} | |
| ] | |
| }); | |
| expect(countSeries(chart)).toEqual(3); | |
| expect(countChartViews(chart)).toEqual(3); | |
| expect(getData0(chart, 0)).toEqual(22222); | |
| expect(getData0(chart, 1)).toEqual(22); | |
| expect(getData0(chart, 2)).toEqual(33); | |
| viewEqualsToOrigin(chart, [0, 1, 2], origins, true); | |
| modelEqualsToOrigin(chart, [0, 1, 2], origins, true); | |
| }); | |
| it('differentTypeMerge', function () { | |
| chart.setOption({ | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22]}, | |
| {type: 'line', data: [33]} | |
| ] | |
| }); | |
| // Merge | |
| const origins = saveOrigins(chart); | |
| chart.setOption({ | |
| series: [ | |
| {type: 'line', data: [111]}, | |
| {type: 'bar', data: [222]}, | |
| {type: 'line', data: [333]} | |
| ] | |
| }); | |
| expect(countSeries(chart)).toEqual(3); | |
| expect(countChartViews(chart)).toEqual(3); | |
| expect(getData0(chart, 0)).toEqual(111); | |
| expect(getData0(chart, 1)).toEqual(222); | |
| expect(getData0(chart, 2)).toEqual(333); | |
| expect(getSeries(chart, 1).type === 'series.bar').toEqual(true); | |
| modelEqualsToOrigin(chart, [0, 2], origins, true); | |
| modelEqualsToOrigin(chart, [1], origins, false); | |
| viewEqualsToOrigin(chart, [0, 2], origins, true); | |
| viewEqualsToOrigin(chart, [1], origins, false); | |
| }); | |
| }); | |
| describe('idSpecified', function () { | |
| it('sameTypeNotMerge', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], id: 20}, | |
| {type: 'line', data: [33], id: 30}, | |
| {type: 'line', data: [44]}, | |
| {type: 'line', data: [55]} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| expect(countSeries(chart)).toEqual(5); | |
| expect(countChartViews(chart)).toEqual(5); | |
| expect(getData0(chart, 0)).toEqual(11); | |
| expect(getData0(chart, 1)).toEqual(22); | |
| expect(getData0(chart, 2)).toEqual(33); | |
| expect(getData0(chart, 3)).toEqual(44); | |
| expect(getData0(chart, 4)).toEqual(55); | |
| const origins = saveOrigins(chart); | |
| chart.setOption(option, true); | |
| expect(countChartViews(chart)).toEqual(5); | |
| expect(countSeries(chart)).toEqual(5); | |
| modelEqualsToOrigin(chart, [0, 1, 2, 3, 4], origins, false); | |
| viewEqualsToOrigin(chart, [0, 1, 2, 3, 4], origins, true); | |
| }); | |
| it('sameTypeMerge', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], id: 20}, | |
| {type: 'line', data: [33], id: 30}, | |
| {type: 'line', data: [44]}, | |
| {type: 'line', data: [55]} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const origins = saveOrigins(chart); | |
| chart.setOption(option); | |
| expect(countChartViews(chart)).toEqual(5); | |
| expect(countSeries(chart)).toEqual(5); | |
| modelEqualsToOrigin(chart, [0, 1, 2, 3, 4], origins, true); | |
| viewEqualsToOrigin(chart, [0, 1, 2, 3, 4], origins, true); | |
| }); | |
| it('differentTypeNotMerge', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], id: 20}, | |
| {type: 'line', data: [33], id: 30}, | |
| {type: 'line', data: [44]}, | |
| {type: 'line', data: [55]} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const origins = saveOrigins(chart); | |
| const option2: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'bar', data: [22], id: 20}, | |
| {type: 'line', data: [33], id: 30}, | |
| {type: 'bar', data: [44]}, | |
| {type: 'line', data: [55]} | |
| ] | |
| }; | |
| chart.setOption(option2, true); | |
| expect(countChartViews(chart)).toEqual(5); | |
| expect(countSeries(chart)).toEqual(5); | |
| modelEqualsToOrigin(chart, [0, 1, 2, 3, 4], origins, false); | |
| viewEqualsToOrigin(chart, [0, 2, 4], origins, true); | |
| viewEqualsToOrigin(chart, [1, 3], origins, false); | |
| }); | |
| it('differentTypeMergeFull', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], id: 20}, | |
| {type: 'line', data: [33], id: 30, name: 'a'}, | |
| {type: 'line', data: [44]}, | |
| {type: 'line', data: [55]} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const origins = saveOrigins(chart); | |
| const option2: EChartsOption = { | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'bar', data: [22], id: 20, name: 'a'}, | |
| {type: 'line', data: [33], id: 30}, | |
| {type: 'bar', data: [44]}, | |
| {type: 'line', data: [55]} | |
| ] | |
| }; | |
| chart.setOption(option2); | |
| expect(countChartViews(chart)).toEqual(5); | |
| expect(countSeries(chart)).toEqual(5); | |
| modelEqualsToOrigin(chart, [0, 2, 4], origins, true); | |
| modelEqualsToOrigin(chart, [1, 3], origins, false); | |
| viewEqualsToOrigin(chart, [0, 2, 4], origins, true); | |
| viewEqualsToOrigin(chart, [1, 3], origins, false); | |
| }); | |
| it('differentTypeMergePartial1', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], id: 20}, | |
| {type: 'line', data: [33]}, | |
| {type: 'line', data: [44], id: 40}, | |
| {type: 'line', data: [55]} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const origins = saveOrigins(chart); | |
| const option2: EChartsOption = { | |
| series: [ | |
| {type: 'bar', data: [444], id: 40}, | |
| {type: 'line', data: [333]}, | |
| {type: 'line', data: [222], id: 20} | |
| ] | |
| }; | |
| chart.setOption(option2); | |
| expect(countChartViews(chart)).toEqual(5); | |
| expect(countSeries(chart)).toEqual(5); | |
| expect(getData0(chart, 0)).toEqual(333); | |
| expect(getData0(chart, 1)).toEqual(222); | |
| expect(getData0(chart, 2)).toEqual(33); | |
| expect(getData0(chart, 3)).toEqual(444); | |
| expect(getData0(chart, 4)).toEqual(55); | |
| modelEqualsToOrigin(chart, [0, 1, 2, 4], origins, true); | |
| modelEqualsToOrigin(chart, [3], origins, false); | |
| viewEqualsToOrigin(chart, [0, 1, 2, 4], origins, true); | |
| viewEqualsToOrigin(chart, [3], origins, false); | |
| }); | |
| it('differentTypeMergePartial2', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], id: 20} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const option2: EChartsOption = { | |
| series: [ | |
| {type: 'bar', data: [444], id: 40}, | |
| {type: 'line', data: [333]}, | |
| {type: 'line', data: [222], id: 20}, | |
| {type: 'line', data: [111]} | |
| ] | |
| }; | |
| chart.setOption(option2); | |
| expect(countChartViews(chart)).toEqual(4); | |
| expect(countSeries(chart)).toEqual(4); | |
| expect(getData0(chart, 0)).toEqual(333); | |
| expect(getData0(chart, 1)).toEqual(222); | |
| expect(getData0(chart, 2)).toEqual(444); | |
| expect(getData0(chart, 3)).toEqual(111); | |
| }); | |
| it('mergePartialDoNotMapToOtherId', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11], id: 10}, | |
| {type: 'line', data: [22], id: 20} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const option2: EChartsOption = { | |
| series: [ | |
| {type: 'bar', data: [444], id: 40} | |
| ] | |
| }; | |
| chart.setOption(option2); | |
| expect(countChartViews(chart)).toEqual(3); | |
| expect(countSeries(chart)).toEqual(3); | |
| expect(getData0(chart, 0)).toEqual(11); | |
| expect(getData0(chart, 1)).toEqual(22); | |
| expect(getData0(chart, 2)).toEqual(444); | |
| }); | |
| it('idDuplicate', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11], id: 10}, | |
| {type: 'line', data: [22], id: 10} | |
| ] | |
| }; | |
| expect(function () { | |
| chart.setOption(option); | |
| }).toThrowError(/duplicate/); | |
| }); | |
| it('nameTheSameButIdNotTheSame', function () { | |
| const option = { | |
| grid: {}, | |
| xAxis: [ | |
| {id: 'x1', name: 'a', xxxx: 'x1_a'}, | |
| {id: 'x2', name: 'b', xxxx: 'x2_b'} | |
| ], | |
| yAxis: {} | |
| }; | |
| chart.setOption(option); | |
| let xAxisModel0; | |
| let xAxisModel1; | |
| xAxisModel0 = getModel(chart, 'xAxis', 0); | |
| xAxisModel1 = getModel(chart, 'xAxis', 1); | |
| expect((xAxisModel0.option as any).xxxx).toEqual('x1_a'); | |
| expect((xAxisModel1.option as any).xxxx).toEqual('x2_b'); | |
| expect(xAxisModel1.option.name).toEqual('b'); | |
| const option2 = { | |
| xAxis: [ | |
| {id: 'k1', name: 'a', xxxx: 'k1_a'}, | |
| {id: 'x2', name: 'a', xxxx: 'x2_a'} | |
| ] | |
| }; | |
| chart.setOption(option2); | |
| xAxisModel0 = getModel(chart, 'xAxis', 0); | |
| xAxisModel1 = getModel(chart, 'xAxis', 1); | |
| const xAxisModel2 = getModel(chart, 'xAxis', 2); | |
| expect((xAxisModel0.option as any).xxxx).toEqual('x1_a'); | |
| expect((xAxisModel1.option as any).xxxx).toEqual('x2_a'); | |
| expect(xAxisModel1.option.name).toEqual('a'); | |
| expect((xAxisModel2.option as any).xxxx).toEqual('k1_a'); | |
| }); | |
| }); | |
| describe('noIdButNameExists', function () { | |
| it('sameTypeNotMerge', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], name: 'a'}, | |
| {type: 'line', data: [33], name: 'b'}, | |
| {type: 'line', data: [44]}, | |
| {type: 'line', data: [55], name: 'a'} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| expect(getSeries(chart, 1)).not.toEqual(getSeries(chart, 4)); | |
| expect(countSeries(chart)).toEqual(5); | |
| expect(countChartViews(chart)).toEqual(5); | |
| expect(getData0(chart, 0)).toEqual(11); | |
| expect(getData0(chart, 1)).toEqual(22); | |
| expect(getData0(chart, 2)).toEqual(33); | |
| expect(getData0(chart, 3)).toEqual(44); | |
| expect(getData0(chart, 4)).toEqual(55); | |
| const origins = saveOrigins(chart); | |
| chart.setOption(option, true); | |
| expect(countChartViews(chart)).toEqual(5); | |
| expect(countSeries(chart)).toEqual(5); | |
| modelEqualsToOrigin(chart, [0, 1, 2, 3, 4], origins, false); | |
| viewEqualsToOrigin(chart, [0, 1, 2, 3, 4], origins, true); | |
| }); | |
| it('sameTypeMerge', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], name: 'a'}, | |
| {type: 'line', data: [33], name: 'b'}, | |
| {type: 'line', data: [44]}, | |
| {type: 'line', data: [55], name: 'a'} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const origins = saveOrigins(chart); | |
| chart.setOption(option); | |
| expect(countChartViews(chart)).toEqual(5); | |
| expect(countSeries(chart)).toEqual(5); | |
| modelEqualsToOrigin(chart, [0, 1, 2, 3, 4], origins, true); | |
| viewEqualsToOrigin(chart, [0, 1, 2, 3, 4], origins, true); | |
| }); | |
| it('differentTypeNotMerge', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], name: 'a'}, | |
| {type: 'line', data: [33], name: 'b'}, | |
| {type: 'line', data: [44]}, | |
| {type: 'line', data: [55], name: 'a'} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const origins = saveOrigins(chart); | |
| const option2: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'bar', data: [22], name: 'a'}, | |
| {type: 'line', data: [33], name: 'b'}, | |
| {type: 'bar', data: [44]}, | |
| {type: 'line', data: [55], name: 'a'} | |
| ] | |
| }; | |
| chart.setOption(option2, true); | |
| expect(countChartViews(chart)).toEqual(5); | |
| expect(countSeries(chart)).toEqual(5); | |
| modelEqualsToOrigin(chart, [0, 1, 2, 3, 4], origins, false); | |
| viewEqualsToOrigin(chart, [0, 2, 4], origins, true); | |
| viewEqualsToOrigin(chart, [1, 3], origins, false); | |
| }); | |
| it('differentTypeMergePartialOneMapTwo', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], name: 'a'}, | |
| {type: 'line', data: [33]}, | |
| {type: 'line', data: [44], name: 'b'}, | |
| {type: 'line', data: [55], name: 'a'} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const origins = saveOrigins(chart); | |
| const option2: EChartsOption = { | |
| series: [ | |
| {type: 'bar', data: [444], id: 40}, | |
| {type: 'line', data: [333]}, | |
| {type: 'bar', data: [222], name: 'a'} | |
| ] | |
| }; | |
| chart.setOption(option2); | |
| expect(countChartViews(chart)).toEqual(6); | |
| expect(countSeries(chart)).toEqual(6); | |
| expect(getData0(chart, 0)).toEqual(333); | |
| expect(getData0(chart, 1)).toEqual(222); | |
| expect(getData0(chart, 2)).toEqual(33); | |
| expect(getData0(chart, 3)).toEqual(44); | |
| expect(getData0(chart, 4)).toEqual(55); | |
| expect(getData0(chart, 5)).toEqual(444); | |
| modelEqualsToOrigin(chart, [0, 2, 3, 4], origins, true); | |
| modelEqualsToOrigin(chart, [1], origins, false); | |
| viewEqualsToOrigin(chart, [0, 2, 3, 4], origins, true); | |
| viewEqualsToOrigin(chart, [1], origins, false); | |
| }); | |
| it('differentTypeMergePartialTwoMapOne', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22], name: 'a'} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const option2: EChartsOption = { | |
| series: [ | |
| {type: 'bar', data: [444], name: 'a'}, | |
| {type: 'line', data: [333]}, | |
| {type: 'line', data: [222], name: 'a'}, | |
| {type: 'line', data: [111]} | |
| ] | |
| }; | |
| chart.setOption(option2); | |
| expect(countChartViews(chart)).toEqual(4); | |
| expect(countSeries(chart)).toEqual(4); | |
| expect(getData0(chart, 0)).toEqual(333); | |
| expect(getData0(chart, 1)).toEqual(444); | |
| expect(getData0(chart, 2)).toEqual(222); | |
| expect(getData0(chart, 3)).toEqual(111); | |
| }); | |
| it('mergePartialCanMapToOtherName', function () { | |
| // Consider case: axis.name = 'some label', which can be overwritten. | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11], name: 10}, | |
| {type: 'line', data: [22], name: 20} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| const option2: EChartsOption = { | |
| series: [ | |
| {type: 'bar', data: [444], name: 40}, | |
| {type: 'bar', data: [999], name: 40}, | |
| {type: 'bar', data: [777], id: 70} | |
| ] | |
| }; | |
| chart.setOption(option2); | |
| expect(countChartViews(chart)).toEqual(3); | |
| expect(countSeries(chart)).toEqual(3); | |
| expect(getData0(chart, 0)).toEqual(444); | |
| expect(getData0(chart, 1)).toEqual(999); | |
| expect(getData0(chart, 2)).toEqual(777); | |
| }); | |
| }); | |
| describe('ohters', function () { | |
| it('aBugCase', function () { | |
| const option: EChartsOption = { | |
| series: [ | |
| { | |
| type: 'pie', | |
| radius: ['20%', '25%'], | |
| center: ['20%', '20%'], | |
| avoidLabelOverlap: true, | |
| label: { | |
| show: true, | |
| position: 'center', | |
| fontSize: '30', | |
| fontWeight: 'bold' | |
| }, | |
| emphasis: { | |
| scale: false, | |
| label: { | |
| show: true | |
| } | |
| }, | |
| data: [ | |
| {value: 135, name: '视频广告'}, | |
| {value: 1548} | |
| ] | |
| } | |
| ] | |
| }; | |
| chart.setOption(option); | |
| chart.setOption({ | |
| series: [ | |
| { | |
| type: 'pie', | |
| radius: ['20%', '25%'], | |
| center: ['20%', '20%'], | |
| avoidLabelOverlap: true, | |
| label: { | |
| show: true, | |
| position: 'center', | |
| fontSize: '30', | |
| fontWeight: 'bold' | |
| }, | |
| data: [ | |
| {value: 135, name: '视频广告'}, | |
| {value: 1548} | |
| ] | |
| }, | |
| { | |
| type: 'pie', | |
| radius: ['20%', '25%'], | |
| center: ['60%', '20%'], | |
| avoidLabelOverlap: true, | |
| label: { | |
| show: true, | |
| position: 'center', | |
| fontSize: '30', | |
| fontWeight: 'bold' | |
| }, | |
| data: [ | |
| {value: 135, name: '视频广告'}, | |
| {value: 1548} | |
| ] | |
| } | |
| ] | |
| }, true); | |
| expect(countChartViews(chart)).toEqual(2); | |
| expect(countSeries(chart)).toEqual(2); | |
| }); | |
| it('color', function () { | |
| const option: EChartsOption = { | |
| backgroundColor: 'rgba(1,1,1,1)', | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22]}, | |
| {type: 'line', data: [33]} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| expect(getECModel(chart).option.backgroundColor).toEqual('rgba(1,1,1,1)'); | |
| // Not merge | |
| chart.setOption({ | |
| backgroundColor: '#fff' | |
| }, true); | |
| expect(getECModel(chart).option.backgroundColor).toEqual('#fff'); | |
| }); | |
| it('innerId', function () { | |
| const option: EChartsOption = { | |
| xAxis: {data: ['a']}, | |
| yAxis: {}, | |
| toolbox: { | |
| feature: { | |
| dataZoom: {} | |
| } | |
| }, | |
| dataZoom: [ | |
| {type: 'inside', id: 'a'}, | |
| {type: 'slider', id: 'b'} | |
| ], | |
| series: [ | |
| {type: 'line', data: [11]}, | |
| {type: 'line', data: [22]} | |
| ] | |
| }; | |
| chart.setOption(option); | |
| expect(countModel(chart, 'dataZoom')).toEqual(4); | |
| expect(getModel(chart, 'dataZoom', 0).id).toEqual('a'); | |
| expect(getModel(chart, 'dataZoom', 1).id).toEqual('b'); | |
| // Merge | |
| chart.setOption({ | |
| dataZoom: [ | |
| {type: 'slider', id: 'c'}, | |
| {type: 'slider', name: 'x'} | |
| ] | |
| }); | |
| expect(countModel(chart, 'dataZoom')).toEqual(5); | |
| expect(getModel(chart, 'dataZoom', 0).id).toEqual('a'); | |
| expect(getModel(chart, 'dataZoom', 1).id).toEqual('b'); | |
| expect(getModel(chart, 'dataZoom', 4).id).toEqual('c'); | |
| }); | |
| }); | |
| }); |