github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 17:59:23 -04:00
Code Issues Projects Releases Packages Wiki Activity

[maps] Ability to offset point labels on maps (#145773)

Browse source 
Resolves https://github.com/elastic/kibana/issues/143677

PR adds "Label position" style setting allowing users to position labels
at top, center, or bottom.

<img width="800" alt="Screen Shot 2022-11-18 at 12 55 44 PM"
src="https://user-images.githubusercontent.com/373691/202792466-b899df1a-60b2-4967-91c3-03c59a8e448a.png">

<img width="800" alt="Screen Shot 2022-11-18 at 12 55 32 PM"
src="https://user-images.githubusercontent.com/373691/202792501-ec0c24da-699d-4394-a7b2-6e2fbd340073.png">

<img width="800" alt="Screen Shot 2022-11-18 at 12 55 14 PM"
src="https://user-images.githubusercontent.com/373691/202792533-28e1a18a-d7c8-48dc-90ca-e67f42a6f9d3.png">

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Nathan Reese 2022-11-29 09:08:54 -07:00 • committed by GitHub
parent d86313f2c5
commit 04360839cd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
21 changed files with 989 additions and 121 deletions
Download patch file Download diff file Expand all files Collapse all files

2
x-pack/plugins/ux/e2e/journeys/index.ts
View file

@ -6,7 +6,7 @@
*/
export * from './core_web_vitals';
export * from './page_views';
// export * from './page_views';
export * from './url_ux_query.journey';
export * from './ux_js_errors.journey';
export * from './ux_client_metrics.journey';

2
x-pack/plugins/ux/public/components/app/rum_dashboard/visitor_breakdown_map/__mocks__/regions_layer.mock.ts
View file

@ -65,6 +65,7 @@ export const mockLayerList = [
iconOrientation: { type: 'STATIC', options: { orientation: 0 } },
labelText: { type: 'STATIC', options: { value: '' } },
labelColor: { type: 'STATIC', options: { color: '#000000' } },
labelPosition: { options: { position: 'CENTER' } },
labelSize: { type: 'STATIC', options: { size: 14 } },
labelBorderColor: { type: 'STATIC', options: { color: '#FFFFFF' } },
labelZoomRange: {
@ -136,6 +137,7 @@ export const mockLayerList = [
iconOrientation: { type: 'STATIC', options: { orientation: 0 } },
labelText: { type: 'STATIC', options: { value: '' } },
labelColor: { type: 'STATIC', options: { color: '#000000' } },
labelPosition: { options: { position: 'CENTER' } },
labelSize: { type: 'STATIC', options: { size: 14 } },
labelBorderColor: { type: 'STATIC', options: { color: '#FFFFFF' } },
labelZoomRange: {

6
x-pack/plugins/ux/public/components/app/rum_dashboard/visitor_breakdown_map/use_layer_list.ts
View file

@ -15,6 +15,7 @@ import {
COLOR_MAP_TYPE,
FIELD_ORIGIN,
LABEL_BORDER_SIZES,
LABEL_POSITIONS,
LAYER_TYPE,
SOURCE_TYPES,
STYLE_TYPE,
@ -118,6 +119,11 @@ export function useLayerList() {
options: { orientation: 0 },
},
labelText: { type: STYLE_TYPE.STATIC, options: { value: '' } },
labelPosition: {
options: {
position: LABEL_POSITIONS.CENTER,
},
},
labelZoomRange: {
options: {
useLayerZoomRange: true,