/* * 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); }); });