| |
| /* |
| * 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 { createChart, removeChart } from '../../core/utHelper'; |
| import { EChartsType, registerMap } from '../../../../src/echarts'; |
| import { GeoJSON } from '../../../../src/coord/geo/geoTypes'; |
| |
| |
| describe('api/containPixel', function () { |
| const testGeoJson1: GeoJSON = { |
| 'type': 'FeatureCollection', |
| 'features': [ |
| { |
| 'type': 'Feature', |
| 'geometry': { |
| 'type': 'Polygon', |
| 'coordinates': [ |
| [ |
| [ |
| 2000, |
| 3000 |
| ], |
| [ |
| 5000, |
| 3000 |
| ], |
| [ |
| 5000, |
| 8000 |
| ], |
| [ |
| 2000, |
| 8000 |
| ] |
| ] |
| ] |
| }, |
| 'properties': { |
| 'name': 'Afghanistan', |
| 'childNum': 1 |
| } |
| } |
| ] |
| }; |
| |
| const testGeoJson2: GeoJSON = { |
| 'type': 'FeatureCollection', |
| 'features': [ |
| { |
| 'type': 'Feature', |
| 'geometry': { |
| 'type': 'Polygon', |
| 'coordinates': [ |
| [ |
| [ |
| 200, |
| 300 |
| ], |
| [ |
| 500, |
| 300 |
| ], |
| [ |
| 500, |
| 800 |
| ], |
| [ |
| 200, |
| 800 |
| ] |
| ] |
| ] |
| }, |
| 'properties': { |
| 'name': 'Afghanistan', |
| 'childNum': 1 |
| } |
| } |
| ] |
| }; |
| |
| let chart: EChartsType; |
| |
| beforeEach(function () { |
| chart = createChart({ |
| width: 200, |
| height: 150 |
| }); |
| }); |
| |
| afterEach(function () { |
| removeChart(chart); |
| }); |
| |
| |
| it('geo', function () { |
| registerMap('test1', testGeoJson1); |
| registerMap('test2', testGeoJson2); |
| |
| chart.setOption({ |
| geo: [ |
| { |
| id: 'aa', |
| left: 10, |
| right: '50%', |
| top: 30, |
| bottom: 40, |
| map: 'test1' |
| }, |
| { |
| id: 'bb', |
| layoutCenter: ['50%', 50], |
| layoutSize: 20, |
| aspectScale: 1, |
| map: 'test2' |
| }, |
| { |
| id: 'cc', |
| aspectScale: 1, |
| left: 0, |
| width: '50%', |
| top: 0, |
| height: '50%', |
| zoom: 0.5, // test roam |
| map: 'test1' |
| } |
| ], |
| series: [ |
| {id: 'k1', type: 'scatter', coordinateSystem: 'geo', geoIndex: 1}, |
| {id: 'k2', type: 'scatter', coordinateSystem: 'geo'} |
| ] |
| }); |
| |
| const width = chart.getWidth(); |
| // const height = chart.getWidth(); |
| |
| expect(chart.containPixel('geo', [15, 30])).toEqual(true); |
| expect(chart.containPixel('geo', [9.5, 30])).toEqual(false); |
| expect(chart.containPixel({geoIndex: 1}, [width / 2, 50])).toEqual(true); |
| expect(chart.containPixel({geoIndex: 1}, [10, 20])).toEqual(false); |
| expect(chart.containPixel({geoId: 'cc'}, [0, 0])).toEqual(false); |
| }); |
| |
| |
| it('map', function () { |
| registerMap('test1', testGeoJson1); |
| registerMap('test2', testGeoJson2); |
| |
| chart.setOption({ |
| series: [ |
| { |
| id: 'k1', |
| type: 'map', |
| map: 'test1', |
| left: 10, |
| right: '50%', |
| top: 30, |
| bottom: 40 |
| }, |
| { |
| id: 'k2', |
| type: 'map', |
| map: 'test2', |
| layoutCenter: ['50%', 50], |
| layoutSize: 20, |
| aspectScale: 1 |
| } |
| ] |
| }); |
| |
| const width = chart.getWidth(); |
| |
| expect(chart.containPixel('series', [15, 30])).toEqual(true); |
| expect(chart.containPixel('series', [9.5, 30])).toEqual(false); |
| expect(chart.containPixel({seriesId: 'k2'}, [width / 2, 50])).toEqual(true); |
| expect(chart.containPixel({seriesId: 1}, [10, 20])).toEqual(false); |
| }); |
| |
| |
| it('cartesian', function () { |
| registerMap('test1', testGeoJson1); |
| |
| chart.setOption({ |
| geo: [ // Should not affect grid converter. |
| { |
| map: 'test1' |
| } |
| ], |
| grid: [ |
| { |
| id: 'g0', |
| left: 10, |
| right: '50%', |
| top: 30, |
| bottom: 40 |
| }, |
| { |
| id: 'g1', |
| left: '50%', |
| right: 20, |
| top: 30, |
| bottom: 40 |
| } |
| ], |
| xAxis: [ |
| { |
| id: 'x0', |
| type: 'value', |
| min: -500, |
| max: 3000, |
| gridId: 'g0' |
| }, |
| { |
| id: 'x1', |
| type: 'value', |
| min: -50, |
| max: 300, |
| gridId: 'g0' |
| }, |
| { |
| id: 'x2', |
| type: 'value', |
| min: -50, |
| max: 300, |
| gridId: 'g1' |
| } |
| ], |
| yAxis: [ |
| { |
| id: 'y0', |
| type: 'value', |
| min: 6000, |
| max: 9000, |
| gridId: 'g0' |
| }, |
| { |
| id: 'y1', |
| type: 'value', |
| inverse: true, // test inverse |
| min: 600, |
| max: 900, |
| gridId: 'g1' |
| } |
| ], |
| series: [ |
| { |
| id: 'k1', |
| type: 'scatter', |
| // left: 0, |
| // right: 0, |
| // top: 0, |
| // bottom: 0, |
| data: [[1000, 700]] |
| }, |
| { |
| id: 'k2', |
| type: 'scatter', |
| // left: 0, |
| // right: 0, |
| // top: 0, |
| // bottom: 0, |
| data: [[100, 800]] |
| }, |
| { |
| id: 'j1', |
| type: 'scatter', |
| // left: 0, |
| // right: 0, |
| // top: 0, |
| // bottom: 0, |
| data: [[100, 800]], |
| xAxisIndex: 1 |
| }, |
| { |
| id: 'i1', |
| type: 'scatter', |
| // left: 0, |
| // right: 0, |
| // top: 0, |
| // bottom: 0, |
| data: [], |
| xAxisId: 'x2', |
| yAxisId: 'y1' |
| } |
| ] |
| }); |
| |
| const width = chart.getWidth(); |
| |
| expect(chart.containPixel('grid', [15, 30])).toEqual(true); |
| expect(chart.containPixel('grid', [9.5, 30])).toEqual(false); |
| expect(chart.containPixel({gridIndex: 1}, [width / 2, 50])).toEqual(true); |
| expect(chart.containPixel({gridIndex: 1}, [10, 20])).toEqual(false); |
| }); |
| |
| |
| // it('pie', function () { |
| |
| // chart.setOption({ |
| // series: [ |
| // { |
| // id: 'k1', |
| // type: 'pie', |
| // center: [40, '50%'], |
| // radius: [10, '50%'], |
| // data: [ |
| // {x: 1000, y: 2000}, |
| // {x: 1000, y: 5000}, |
| // {x: 3000, y: 5000}, |
| // {x: 3000, y: 2000} |
| // ], |
| // links: [] |
| // } |
| // ] |
| // }); |
| |
| // const height = chart.getHeight(); |
| |
| // expect(chart.containPixel('series', [40, height / 2])).toEqual(false); |
| // expect(chart.containPixel('series', [40, height / 2 + 10])).toEqual(true); |
| // expect(chart.containPixel('series', [9.5, 1])).toEqual(false); |
| // }); |
| |
| |
| // it('pieAndGeo', function () { |
| // registerMap('test1', testGeoJson1); |
| // registerMap('test2', testGeoJson2); |
| |
| // chart.setOption({ |
| // geo: [ |
| // { |
| // id: 'aa', |
| // left: 10, |
| // top: 10, |
| // width: 10, |
| // height: 10, |
| // map: 'test1' |
| // }, |
| // { |
| // id: 'bb', |
| // left: 100, |
| // top: 10, |
| // width: 10, |
| // height: 10, |
| // map: 'test2' |
| // } |
| // ], |
| // series: [ |
| // {id: 'k1', type: 'scatter', coordinateSystem: 'geo', geoIndex: 1}, |
| // {id: 'k2', type: 'scatter', coordinateSystem: 'geo'}, |
| // { |
| // id: 'k3', |
| // type: 'pie', |
| // center: [40, 100], |
| // radius: [3, 10], |
| // data: [ |
| // {x: 1000, y: 2000}, |
| // {x: 1000, y: 5000} |
| // ], |
| // links: [] |
| // } |
| // ] |
| // }); |
| |
| // expect(chart.containPixel({geoIndex: [0, 1], seriesId: 'k3'}, [15, 15])).toEqual(true); |
| // expect(chart.containPixel({geoIndex: [0, 1], seriesId: 'k3'}, [15, 25])).toEqual(false); |
| // expect(chart.containPixel({geoIndex: [0, 1], seriesId: 'k3'}, [105, 15])).toEqual(true); |
| // expect(chart.containPixel({geoIndex: [0, 1], seriesId: 'k3'}, [105, 25])).toEqual(false); |
| // expect(chart.containPixel({geoIndex: [0, 1], seriesId: 'k3'}, [45, 100])).toEqual(true); |
| // expect(chart.containPixel({geoIndex: [0, 1], seriesId: 'k3'}, [55, 100])).toEqual(false); |
| // }); |
| |
| |
| it('graph', function () { |
| registerMap('test1', testGeoJson1); |
| |
| chart.setOption({ |
| geo: [ // Should not affect graph converter. |
| { |
| map: 'test1' |
| } |
| ], |
| series: [ |
| { |
| id: 'k1', |
| type: 'graph', |
| left: 10, |
| right: '50%', |
| top: 30, |
| bottom: 40, |
| data: [ |
| {x: 1000, y: 2000}, |
| {x: 1000, y: 5000}, |
| {x: 3000, y: 5000}, |
| {x: 3000, y: 2000} |
| ], |
| links: [] |
| } |
| ] |
| }); |
| |
| expect(chart.containPixel('series', [15, 35])).toEqual(true); |
| expect(chart.containPixel('series', [3, 4])).toEqual(false); |
| }); |
| |
| |
| }); |
