SAP/abap2UI5
1
0
Fork 0
mirror of https://github.com/abap2UI5/abap2UI5.git synced 2025-04-29 20:36:46 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

add annotations to chartjs (#803)

Browse Source
This commit is contained in:
choper725 2024-01-21 22:13:41 +02:00 committed by GitHub
parent 70da7816d8
commit 4b10d305f0
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 125 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

180
src/02/z2ui5_cl_cc_chartjs.clas.abap
View File

@ -52,8 +52,8 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
border_color TYPE string, border_color TYPE string,
border_radius TYPE i, border_radius TYPE i,
border_width TYPE i, border_width TYPE i,
clamp TYPE xfeld, clamp TYPE abap_bool,
clip TYPE xfeld, clip TYPE abap_bool,
color TYPE string, color TYPE string,
display TYPE abap_bool, display TYPE abap_bool,
font TYPE ty_font, font TYPE ty_font,
@ -90,19 +90,19 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
border_width TYPE i, border_width TYPE i,
border_color TYPE string, border_color TYPE string,
border_radius TYPE i, border_radius TYPE i,
border_skipped TYPE xfeld, border_skipped TYPE abap_bool,
show_line TYPE xfeld, show_line TYPE abap_bool,
background_color_t TYPE ty_bg_color, background_color_t TYPE ty_bg_color,
background_color TYPE string, background_color TYPE string,
hover_offset TYPE i, hover_offset TYPE i,
order TYPE i, order TYPE i,
fill TYPE string, fill TYPE string,
hidden TYPE xfeld, hidden TYPE abap_bool,
point_style TYPE string, point_style TYPE string,
point_border_color TYPE string, point_border_color TYPE string,
point_radius TYPE i, point_radius TYPE i,
point_hover_radius TYPE i, point_hover_radius TYPE i,
rtl TYPE xfeld, rtl TYPE abap_bool,
datalabels TYPE ty_datalabels, datalabels TYPE ty_datalabels,
END OF ty_dataset. END OF ty_dataset.
@ -122,7 +122,7 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
TYPES: TYPES:
BEGIN OF ty_autocolors_plugin, BEGIN OF ty_autocolors_plugin,
enabled TYPE xfeld, enabled TYPE abap_bool,
mode TYPE string, mode TYPE string,
offset TYPE i, offset TYPE i,
repeat TYPE i, repeat TYPE i,
@ -131,10 +131,10 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
TYPES: TYPES:
BEGIN OF ty_title, BEGIN OF ty_title,
text TYPE string, text TYPE string,
display TYPE xfeld, display TYPE abap_bool,
align TYPE string, align TYPE string,
color TYPE string, color TYPE string,
full_size TYPE xfeld, full_size TYPE abap_bool,
position TYPE string, position TYPE string,
font TYPE ty_font, font TYPE ty_font,
padding TYPE ty_padding, padding TYPE ty_padding,
@ -144,7 +144,7 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
BEGIN OF ty_labels, BEGIN OF ty_labels,
box_width TYPE i, box_width TYPE i,
box_height TYPE i, box_height TYPE i,
color TYPE xfeld, color TYPE abap_bool,
font TYPE ty_font, font TYPE ty_font,
padding TYPE i, padding TYPE i,
generate_labels TYPE string, generate_labels TYPE string,
@ -152,9 +152,9 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
sort TYPE string, sort TYPE string,
point_style TYPE string, point_style TYPE string,
text_align TYPE string, text_align TYPE string,
use_point_style TYPE xfeld, use_point_style TYPE abap_bool,
point_style_width TYPE i, point_style_width TYPE i,
use_border_radius TYPE xfeld, use_border_radius TYPE abap_bool,
border_radius TYPE i, border_radius TYPE i,
END OF ty_labels . END OF ty_labels .
@ -162,16 +162,16 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
BEGIN OF ty_legend, BEGIN OF ty_legend,
position TYPE string, position TYPE string,
align TYPE string, align TYPE string,
display TYPE xfeld, display TYPE abap_bool,
max_height TYPE i, max_height TYPE i,
max_width TYPE i, max_width TYPE i,
full_size TYPE i, full_size TYPE i,
on_click TYPE string, on_click TYPE string,
on_hover TYPE string, on_hover TYPE string,
on_leave TYPE string, on_leave TYPE string,
reverse TYPE xfeld, reverse TYPE abap_bool,
labels TYPE ty_labels, labels TYPE ty_labels,
rtl TYPE xfeld, rtl TYPE abap_bool,
text_direction TYPE string, text_direction TYPE string,
title TYPE ty_title, title TYPE ty_title,
END OF ty_legend . END OF ty_legend .
@ -179,7 +179,7 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
TYPES: TYPES:
BEGIN OF ty_subtitle, BEGIN OF ty_subtitle,
text TYPE string, text TYPE string,
display TYPE xfeld, display TYPE abap_bool,
color TYPE string, color TYPE string,
font TYPE ty_font, font TYPE ty_font,
padding TYPE ty_padding, padding TYPE ty_padding,
@ -207,11 +207,11 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
BEGIN OF ty_tooltip, BEGIN OF ty_tooltip,
callbacks TYPE ty_callback, callbacks TYPE ty_callback,
mode TYPE string, mode TYPE string,
intersect TYPE xfeld, intersect TYPE abap_bool,
use_point_style TYPE xfeld, use_point_style TYPE abap_bool,
enabled TYPE xfeld, enabled TYPE abap_bool,
display_colors TYPE xfeld, display_colors TYPE abap_bool,
rtl TYPE xfeld, rtl TYPE abap_bool,
external TYPE string, external TYPE string,
position TYPE string, position TYPE string,
item_sort TYPE string, item_sort TYPE string,
@ -248,7 +248,7 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
TYPES: TYPES:
BEGIN OF ty_filler, BEGIN OF ty_filler,
propagate TYPE xfeld, propagate TYPE abap_bool,
END OF ty_filler . END OF ty_filler .
TYPES: TYPES:
@ -258,6 +258,46 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
y_offset TYPE string, y_offset TYPE string,
END OF ty_deferred. END OF ty_deferred.
TYPES:
BEGIN OF ty_label,
background_color TYPE string,
content TYPE string,
display TYPE abap_bool,
font TYPE ty_font,
END OF ty_label.
TYPES:
BEGIN OF ty_annotations,
type TYPE string,
border_color TYPE string,
border_width TYPE string,
click TYPE string,
scaleid TYPE string,
value TYPE string,
draw_time TYPE string,
x_max TYPE string,
x_min TYPE string,
x_scaleid TYPE string,
y_scaleid TYPE string,
y_max TYPE string,
y_min TYPE string,
label TYPE ty_label,
END OF ty_annotations.
TYPES:
BEGIN OF ty_shapes,
shape1 TYPE ty_annotations,
shape2 TYPE ty_annotations,
shape3 TYPE ty_annotations,
shape4 TYPE ty_annotations,
shape5 TYPE ty_annotations,
END OF ty_shapes.
TYPES:
BEGIN OF ty_annotation,
annotations TYPE ty_shapes,
END OF ty_annotation.
TYPES: TYPES:
BEGIN OF ty_plugins, BEGIN OF ty_plugins,
deferred TYPE ty_deferred, deferred TYPE ty_deferred,
@ -269,12 +309,13 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
tooltip TYPE ty_tooltip, tooltip TYPE ty_tooltip,
filler TYPE ty_filler, filler TYPE ty_filler,
subtitle TYPE ty_subtitle, subtitle TYPE ty_subtitle,
annotation TYPE ty_annotation,
END OF ty_plugins . END OF ty_plugins .
TYPES: TYPES:
BEGIN OF ty_point_label, BEGIN OF ty_point_label,
display TYPE xfeld, display TYPE abap_bool,
center_point_labels TYPE xfeld, center_point_labels TYPE abap_bool,
font TYPE ty_font, font TYPE ty_font,
backdrop_color TYPE string, backdrop_color TYPE string,
backdrop_padding TYPE ty_padding, backdrop_padding TYPE ty_padding,
@ -291,9 +332,9 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
align TYPE string, align TYPE string,
cross_align TYPE string, cross_align TYPE string,
sample_size TYPE i, sample_size TYPE i,
auto_skip TYPE xfeld, auto_skip TYPE abap_bool,
include_bounds TYPE xfeld, include_bounds TYPE abap_bool,
mirror TYPE xfeld, mirror TYPE abap_bool,
auto_skip_padding TYPE i, auto_skip_padding TYPE i,
label_offset TYPE i, label_offset TYPE i,
max_rotation TYPE i, max_rotation TYPE i,
@ -303,8 +344,8 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
backdrop_color TYPE string, backdrop_color TYPE string,
backdrop_padding TYPE ty_padding, backdrop_padding TYPE ty_padding,
callback TYPE string, callback TYPE string,
display TYPE xfeld, display TYPE abap_bool,
show_label_backdrop TYPE xfeld, show_label_backdrop TYPE abap_bool,
text_stroke_color TYPE string, text_stroke_color TYPE string,
font TYPE ty_font, font TYPE ty_font,
text_stroke_width TYPE i, text_stroke_width TYPE i,
@ -315,7 +356,7 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
TYPES: TYPES:
BEGIN OF ty_border, BEGIN OF ty_border,
color TYPE string, color TYPE string,
display TYPE xfeld, display TYPE abap_bool,
width TYPE i, width TYPE i,
dash TYPE i, dash TYPE i,
dash_offset TYPE i, dash_offset TYPE i,
@ -329,11 +370,11 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
tick_color TYPE string, tick_color TYPE string,
border_dash TYPE string, border_dash TYPE string,
border_dash_offset TYPE p LENGTH 3 DECIMALS 2, border_dash_offset TYPE p LENGTH 3 DECIMALS 2,
circular TYPE xfeld, circular TYPE abap_bool,
line_width TYPE i, line_width TYPE i,
draw_on_chart_area TYPE xfeld, draw_on_chart_area TYPE abap_bool,
draw_ticks TYPE xfeld, draw_ticks TYPE abap_bool,
offset TYPE xfeld, offset TYPE abap_bool,
tick_border_dash TYPE i, tick_border_dash TYPE i,
tick_border_dash_offset TYPE i, tick_border_dash_offset TYPE i,
tick_length TYPE i, tick_length TYPE i,
@ -345,7 +386,7 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
BEGIN OF ty_angle_lines, BEGIN OF ty_angle_lines,
color TYPE string, color TYPE string,
border_color TYPE string, border_color TYPE string,
display TYPE xfeld, display TYPE abap_bool,
line_width TYPE i, line_width TYPE i,
border_dash TYPE i, border_dash TYPE i,
border_dash_offset TYPE i, border_dash_offset TYPE i,
@ -353,14 +394,14 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
TYPES: TYPES:
BEGIN OF ty_scale, BEGIN OF ty_scale,
begin_at_zero TYPE xfeld, begin_at_zero TYPE abap_bool,
min TYPE string, min TYPE string,
max TYPE string, max TYPE string,
point_labels TYPE ty_point_label, point_labels TYPE ty_point_label,
stacked TYPE xfeld, stacked TYPE abap_bool,
reverse TYPE xfeld, reverse TYPE abap_bool,
align_to_pixels TYPE xfeld, align_to_pixels TYPE abap_bool,
clip TYPE xfeld, clip TYPE abap_bool,
bounds TYPE string, bounds TYPE string,
background_color TYPE string, background_color TYPE string,
type TYPE string, type TYPE string,
@ -374,7 +415,7 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
ticks TYPE ty_ticks, ticks TYPE ty_ticks,
border TYPE ty_border, border TYPE ty_border,
grid TYPE ty_grid, grid TYPE ty_grid,
offset TYPE xfeld, offset TYPE abap_bool,
axis TYPE string, axis TYPE string,
labels TYPE string_table, labels TYPE string_table,
angle_lines TYPE ty_angle_lines, angle_lines TYPE ty_angle_lines,
@ -391,8 +432,8 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
TYPES: TYPES:
BEGIN OF ty_interaction, BEGIN OF ty_interaction,
mode TYPE string, mode TYPE string,
intersect TYPE xfeld, intersect TYPE abap_bool,
include_invisible TYPE xfeld, include_invisible TYPE abap_bool,
axis TYPE string, axis TYPE string,
END OF ty_interaction . END OF ty_interaction .
@ -402,7 +443,7 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
easing TYPE string, easing TYPE string,
from TYPE i, from TYPE i,
to TYPE i, to TYPE i,
loop TYPE xfeld, loop TYPE abap_bool,
END OF ty_tension . END OF ty_tension .
TYPES: TYPES:
@ -413,12 +454,12 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
TYPES: TYPES:
BEGIN OF ty_hover, BEGIN OF ty_hover,
mode TYPE string, mode TYPE string,
intersec TYPE xfeld, intersec TYPE abap_bool,
END OF ty_hover . END OF ty_hover .
TYPES: TYPES:
BEGIN OF ty_layout, BEGIN OF ty_layout,
auto_padding TYPE xfeld, auto_padding TYPE abap_bool,
padding TYPE ty_padding, padding TYPE ty_padding,
END OF ty_layout . END OF ty_layout .
@ -445,8 +486,8 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
border_dash_offset TYPE i, border_dash_offset TYPE i,
border_join_style TYPE string, border_join_style TYPE string,
cubic_interpolation_mode TYPE string, cubic_interpolation_mode TYPE string,
cap_bezier_points TYPE xfeld, cap_bezier_points TYPE abap_bool,
stepped TYPE xfeld, stepped TYPE abap_bool,
background_color TYPE string, background_color TYPE string,
border_color TYPE string, border_color TYPE string,
END OF ty_line . END OF ty_line .
@ -471,7 +512,7 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
border_dash TYPE i, border_dash TYPE i,
border_dash_offset TYPE i, border_dash_offset TYPE i,
border_join_style TYPE string, border_join_style TYPE string,
circular TYPE xfeld, circular TYPE abap_bool,
angle TYPE i, angle TYPE i,
END OF ty_arc. END OF ty_arc.
@ -483,11 +524,10 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
arc TYPE ty_arc, arc TYPE ty_arc,
END OF ty_elements . END OF ty_elements .
TYPES: TYPES:
BEGIN OF ty_options, BEGIN OF ty_options,
scales TYPE ty_scales, scales TYPE ty_scales,
responsive TYPE xfeld, responsive TYPE abap_bool,
plugins TYPE ty_plugins, plugins TYPE ty_plugins,
hover TYPE ty_hover, hover TYPE ty_hover,
interaction TYPE ty_interaction, interaction TYPE ty_interaction,
@ -528,13 +568,17 @@ CLASS z2ui5_cl_cc_chartjs DEFINITION
CLASS-METHODS get_js_wordcloud CLASS-METHODS get_js_wordcloud
RETURNING RETURNING
VALUE(result) TYPE string . VALUE(result) TYPE string .
CLASS-METHODS get_js_annotation
RETURNING
VALUE(result) TYPE string .
CLASS-METHODS load_js CLASS-METHODS load_js
IMPORTING IMPORTING
datalabels TYPE xfeld DEFAULT abap_false datalabels TYPE abap_bool DEFAULT abap_false
autocolors TYPE xfeld DEFAULT abap_false autocolors TYPE abap_bool DEFAULT abap_false
deferred TYPE xfeld DEFAULT abap_false deferred TYPE abap_bool DEFAULT abap_false
venn TYPE xfeld DEFAULT abap_false venn TYPE abap_bool DEFAULT abap_false
wordcloud TYPE xfeld DEFAULT abap_false wordcloud TYPE abap_bool DEFAULT abap_false
annotation TYPE abap_bool DEFAULT abap_false
RETURNING RETURNING
VALUE(result) TYPE string . VALUE(result) TYPE string .
CLASS-METHODS load_cc CLASS-METHODS load_cc
@ -562,6 +606,11 @@ CLASS Z2UI5_CL_CC_CHARTJS IMPLEMENTATION.
ENDMETHOD. ENDMETHOD.
METHOD get_js_annotation.
result = `https://cdn.jsdelivr.net/npm/chartjs-plugin-annotation@3.0.1/dist/chartjs-plugin-annotation.min.js`.
ENDMETHOD.
METHOD get_js_autocolors. METHOD get_js_autocolors.
"chartjs-plugin-datalabels must be loaded after the Chart.js library! "chartjs-plugin-datalabels must be loaded after the Chart.js library!
result = `https://cdn.jsdelivr.net/npm/chartjs-plugin-autocolors`. result = `https://cdn.jsdelivr.net/npm/chartjs-plugin-autocolors`.
@ -633,14 +682,20 @@ CLASS Z2UI5_CL_CC_CHARTJS IMPLEMENTATION.
` setConfig: function(oConfig) { ` && |\n| && ` setConfig: function(oConfig) { ` && |\n| &&
` var canvas_id = this.getProperty("canvas_id");` && |\n| && ` var canvas_id = this.getProperty("canvas_id");` && |\n| &&
` var cVar = canvas_id+'_chartjs'; ` && |\n| && ` var cVar = canvas_id+'_chartjs'; ` && |\n| &&
` var cType = oConfig.type;` && |\n| && * ` var cType = oConfig.type;` && |\n| &&
` if(cType == 'venn') {` && |\n| && * ` if(cType == 'venn') {` && |\n| &&
* ` var tConfig = JSON.stringify(oConfig);` && |\n| &&
* ` tConfig = tConfig.replace("dataVenn","data");` && |\n| &&
* ` oConfig = JSON.parse(tConfig);` && |\n| &&
* ` } else {` && |\n| &&
* ` this.setProperty("config", oConfig );` && |\n| &&
* ` };` && |\n| &&
` var tConfig = JSON.stringify(oConfig);` && |\n| && ` var tConfig = JSON.stringify(oConfig);` && |\n| &&
` tConfig = tConfig.replace("dataVenn","data");` && |\n| && ` tConfig = tConfig.replace("dataVenn","data");` && |\n| &&
` tConfig = tConfig.replace("scaleid","scaleID");` && |\n| &&
` tConfig = tConfig.replace("xScaleid","xScaleID");` && |\n| &&
` tConfig = tConfig.replace("yScaleid","yScaleID");` && |\n| &&
` oConfig = JSON.parse(tConfig);` && |\n| && ` oConfig = JSON.parse(tConfig);` && |\n| &&
` } else {` && |\n| &&
` this.setProperty("config", oConfig );` && |\n| &&
` };` && |\n| &&
` this.setProperty("config", oConfig );` && |\n| && ` this.setProperty("config", oConfig );` && |\n| &&
` if(oConfig){ fixJsonLibs(oConfig); };` && |\n| && ` if(oConfig){ fixJsonLibs(oConfig); };` && |\n| &&
` if(window[cVar]?.data) { window[cVar].data = oConfig.data; }` && |\n| && ` if(window[cVar]?.data) { window[cVar].data = oConfig.data; }` && |\n| &&
@ -705,6 +760,9 @@ CLASS Z2UI5_CL_CC_CHARTJS IMPLEMENTATION.
lv_libs = lv_libs && `,` && `sap.z2ui5.ChartDeferred`. lv_libs = lv_libs && `,` && `sap.z2ui5.ChartDeferred`.
ENDIF. ENDIF.
ENDIF. ENDIF.
IF annotation = abap_true.
result = result && `libs.push("` && get_js_annotation( ) && `");` && |\n|.
ENDIF.
IF venn = abap_true. IF venn = abap_true.
result = result && `libs.push("` && get_js_venn( ) && `");` && |\n|. result = result && `libs.push("` && get_js_venn( ) && `");` && |\n|.
ENDIF. ENDIF.