SuperX
/
viz
6
0
Fork 0
Code Issues 8 Pull Requests Projects Releases Wiki Activity
Browse Source

Tooltips #5

makro_datasrc
Daniel Quathamer 2 years ago
parent
1f1fe9cca9
commit
04d4d047eb
7 changed files with 78 additions and 41 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 7
      src-modules/module/viz/conf/includes.txt
  2. 58
      src-modules/module/viz/schluesseltabellen/viz_property.unl
  3. 2
      src-modules/module/viz/schluesseltabellen/viz_property_upload.x
  4. 21
      superx/style/LICENSE_bulma_tooltip_1.2.0.txt
  5. 2
      superx/style/bulma-tooltip.min.css
  6. 27
      superx/xml/js/viz/viz_functions.js
  7. 2
      superx/xml/viz_html_chart.xsl

7
src-modules/module/viz/conf/includes.txt
Unescape View File

@ -3,10 +3,13 @@ images/icons/more.svg
images/icons/chart-bar.svg images/icons/chart-bar.svg
images/information_grey_liberation.svg images/information_grey_liberation.svg
style/sx_viz_muster.css style/sx_viz_muster.css
style/bulma-tooltip.min.css
style/LICENSE_bulma_tooltip_1.2.0.txt
WEB-INF/conf/edustore/db/bin/SQL_ENV_viz.sam WEB-INF/conf/edustore/db/bin/SQL_ENV_viz.sam
xml/js/viz/viz_functions.js xml/js/viz/viz_functions.js
xml/js/viz/d3.min.js xml/js/viz/d3.min.js
xml/js/viz/d3-license.txt xml/js/viz/d3-7.8.0-license.txt
xml/viz_html_chart.xsl
xml/js/viz/plot.js xml/js/viz/plot.js
xml/js/viz/plot-0.6.1-license.txt
xml/viz_html_chart.xsl

58
src-modules/module/viz/schluesseltabellen/viz_property.unl
Unescape View File

@ -1,34 +1,34 @@
1^Diagramm-Höhe^height^400^px^1^ ^0^4^10^(Wird nur ausgewertet wenn es keine Y-Achse gibt)^101^^^integer^ 1^Diagramm-Höhe^height^400^px^1^ ^0^4^10^Diagrammhöhe (exkl. Skalenbeschriftung). Wird nur ausgewertet wenn es keine Y-Achse gibt!^101^^^integer^
2^Diagramm-Breite^width^500^px^1^ ^0^4^10^Äußere Breite des Diagramms inkl. Ränder^102^100^2000^integer^ 2^Diagramm-Breite^width^500^px^1^ ^0^4^10^Diagrammsbreite (exkl.Skalenbeschriftung)^102^100^2000^integer^
3^Werte-Label-Breite^valueLabelWidth^20^px^1^^0^1^18^^^^^integer^ 3^Werte-Label-Breite^valueLabelWidth^20^px^1^^0^1^18^^^^^integer^
4^Hintergrundfarbe^backgroundColor^#ccffcc^ ^1^#ffffeb^0^3^11^ ^201^^^string^ 4^Hintergrundfarbe^backgroundColor^#ccffcc^ ^1^#ffffeb^0^3^11^Hintergrundfarbe der Grafik^201^^^string^
5^Vordergrundfarbe^color^black^ ^1^black^0^3^11^Text- und Diagrammelemente^202^^^string^ 5^Vordergrundfarbe^color^black^ ^1^black^0^3^11^Farbe von Text- und Diagrammelementen^202^^^string^
6^Schriftgröße^fontSize^10^px^1^ ^0^4^11^Text- und Diagrammelemente^204^^^integer^ 6^Schriftgröße^fontSize^10^px^1^ ^0^4^11^Schriftgröße der Skalenbeschriftung^204^^^integer^
7^Schriftfamilie^fontFamily^serif^ ^1^serif|sans-serif|monospace|system_ui^0^2^11^ ^203^^^string^ 7^Schriftfamilie^fontFamily^serif^ ^1^serif|sans-serif|monospace|system_ui^0^2^11^Schriftfamlilie der Skalenbeschriftung^203^^^string^
8^Flächenfarbe^fill^blue^ ^1^ ^0^1^10^relevant für Flächen,Balken, Säulen, Streifen, Punkte^305^^^string^ 8^Flächenfarbe^fill^blue^ ^1^ ^0^1^10^Füllfarbe (nur) von Diagrammelementen (Flächen, Balken, Säulen, Streifen, Punkte)^305^^^string^
11^Kat: Schriftneigung^tickRotate^-45^ ^1^ ^0^1^18^ ^604^^^integer^ 11^Kat: Schriftneigung^tickRotate^-45^ ^1^ ^0^1^18^Neigungswinkel der Achsenwerte^604^^^integer^
12^Kat: Skalierung^ticks^5^ ^1^ ^0^1^18^ ^605^^^integer^ 12^Kat: Skalierung^ticks^5^ ^1^ ^0^1^18^Feinheit der Wertegliederung^605^^^integer^
13^Kat: Schriftgröße^tickSize^10^ ^1^ ^0^1^18^ ^603^^^integer^ 13^Kat: Schriftgröße^tickSize^10^ ^1^ ^0^1^18^Größe der Achsenwerte^603^^^integer^
15^Kat: Label-Ausrichtung^labelAnchor^center^ ^1^left|center|right^0^2^18^ ^601^^^string^ 15^Kat: Label-Ausrichtung^labelAnchor^center^ ^1^left|center|right^0^2^18^Label-Position^601^^^string^
16^Außenrand links^marginLeft^ ^px^1^ ^0^4^10^ ^103^^^integer^ 16^Außenrand links^marginLeft^ ^px^1^ ^0^4^10^Abstand links neben der Grafik (inkl. Skala)^103^^^integer^
17^Außenrand rechts^marginRight^50^px^1^ ^0^4^10^ ^104^^^integer^ 17^Außenrand rechts^marginRight^50^px^1^ ^0^4^10^Abstand rechts neben der Grafik (inkl. Skala)^104^^^integer^
18^Außenrand oben^marginTop^50^px^1^ ^0^4^10^ ^105^^^integer^ 18^Außenrand oben^marginTop^50^px^1^ ^0^4^10^Abstand oberhalb der Grafik^105^^^integer^
19^Außenrand unten^marginBottom^50^px^1^ ^0^4^10^ ^106^^^integer^ 19^Außenrand unten^marginBottom^50^px^1^ ^0^4^10^ ^106^^^integer^
20^Innenrand oben^insetTop^0^px^1^ ^0^4^10^ ^107^^^integer^ 20^Innenrand oben^insetTop^0^px^1^ ^0^4^10^Oberer Abstand zwischen Diagramm und Grafik^107^^^integer^
21^Innenrand unten^insetBottom^0^px^1^ ^0^4^10^ ^108^^^integer^ 21^Innenrand unten^insetBottom^0^px^1^ ^0^4^10^Unterer Abstand zwischen Diagramm und Grafik^108^^^integer^
22^Innenrand links^insetLeft^0^px^1^ ^0^4^10^ ^109^^^integer^ 22^Innenrand links^insetLeft^0^px^1^ ^0^4^10^Linker Abstand zwischen Diagramm und Grafik^109^^^integer^
23^Innenrand rechts^insetRight^0^px^1^ ^0^4^10^ ^110^^^integer^ 23^Innenrand rechts^insetRight^0^px^1^ ^0^4^10^Rechter Abstand zwischen Diagramm und Grafik^110^^^integer^
24^Farbschema^scheme^ ^ ^1^blues|greens|greys|oranges|purples|reds^0^2^20^ ^303^^^string^ 24^Farbschema^scheme^ ^ ^1^blues|greens|greys|oranges|purples|reds^0^2^20^Farbschema von Diagrammelemente^303^^^string^
25^Farbtyp^type^ ^ ^1^einfarbig|mehrfarbig|zyklisch^0^2^12^ ^302^^^string^ 25^Farbtyp^type^ ^ ^1^einfarbig|mehrfarbig|zyklisch^0^2^12^Ein-/Mehrfarbigkeit von Diagrammelementen^302^^^string^
43^Farbsättigung^fillOpacity^0,5^ ^1^ ^0^4^12^ ^306^^^string^ 43^Farbsättigung^fillOpacity^0,5^ ^1^ ^0^4^12^Deckkraft der Füllfarbe von Diagrammelementen^306^^^string^
44^Strichfarbe^stroke^ ^ ^1^ ^0^1^12^sfsfsdf^307^^^string^ 44^Strichfarbe^stroke^ ^ ^1^ ^0^1^12^Strichfarbe von Diagrammelementen (relevant für Plot.dot, Plot.tickX/Y)^307^^^string^
45^Strichdicke^strokeWidth^ ^ ^1^ ^0^1^12^^308^^^string^ 45^Strichdicke^strokeWidth^ ^ ^1^ ^0^1^12^Strichdicke von Diagrammelementen (relevant für Plot.dot, Plot.tickX/Y)^308^^^string^
56^Fortlaufende Skala^continous scales^ ^ ^1^identity|linear|log|pow|sqrt|symlog^0^2^15^ ^401^^^string^ 56^Fortlaufende Skala^continous scales^ ^ ^1^identity|linear|log|pow|sqrt|symlog^0^2^15^Art der Skalen-Gliederung^401^^^string^
57^Kategorie-Skala^categorical scales^ ^ ^1^point|band^0^2^15^ ^402^^^string^ 57^Kategorie-Skala^categorical scales^ ^ ^1^point|band^0^2^15^Art der Skalen-Gliederung^402^^^string^
58^Datums-Skala^date scales^ ^ ^1^time|utc^0^2^15^ ^403^^^string^ 58^Datums-Skala^date scales^ ^ ^1^time|utc^0^2^15^Art der Skalen-Gliederung^403^^^string^
60^Farbschema-Typ^schemetype^ ^ ^1^linear|sqrt|pow|log|symlog|sequential|cyclical|quantile^0^2^12^ ^304^^^string^ 60^Farbschema-Typ^schemetype^ ^ ^1^linear|sqrt|pow|log|symlog|sequential|cyclical|quantile^0^2^12^Art der Farbverteilung in Diagrammelementen^304^^^string^
61^Elementtyp^marks^ ^ ^1^Plot.line|Plot.dot|Plot.areaX|Plot.areaY.|Plot.barX|Plot.barY|Plot.rectX|Plot.rectY|Plot.ruleX|Plot.ruleY|Plot.tickX|Plot.tickY|Plot.arrow|Plot.cell|Plot.text|Plot.link|Plot.image^0^2^12^ ^301^^^string^ 61^Elementtyp^marks^ ^ ^1^Plot.line|Plot.dot|Plot.areaX|Plot.areaY.|Plot.barX|Plot.barY|Plot.rectX|Plot.rectY|Plot.ruleX|Plot.ruleY|Plot.tickX|Plot.tickY|Plot.arrow|Plot.cell|Plot.text|Plot.link|Plot.image^0^2^12^Ausrichtung und Form der Dialgrammelemente^301^^^string^
63^Kat: Label-Abstand^labelOffset^ ^px^1^ ^0^1^18^ ^602^^^integer^ 63^Kat: Label-Abstand^labelOffset^ ^px^1^ ^0^1^18^Label-Abstand von Achse^602^^^integer^
68^Maß: Chart-Abstand^gridChartOffset^3^ ^1^ ^0^1^18^ ^607^^^string^ 68^Maß: Chart-Abstand^gridChartOffset^3^ ^1^ ^0^1^18^ ^607^^^string^
69^Maß: Label-Höhe^gridLabelHeight^18^px^1^ ^0^1^18^ ^608^^^integer^ 69^Maß: Label-Höhe^gridLabelHeight^18^px^1^ ^0^1^18^ ^608^^^integer^
70^Kategorie-Dimension 1^viz_dimension1^ ^ ^1^ ^0^1^5^ ^608^^^string^ 70^Kategorie-Dimension 1^viz_dimension1^ ^ ^1^ ^0^1^5^ ^608^^^string^

2
src-modules/module/viz/schluesseltabellen/viz_property_upload.x
Unescape View File

@ -4,3 +4,5 @@ sx_auto_upload_table.x viz_property_group
sx_auto_upload_table.x viz_renderer sx_auto_upload_table.x viz_renderer
sx_auto_upload_table.x viz_property_renderer sx_auto_upload_table.x viz_property_renderer
sx_auto_upload_table.x viz_property_group_renderer sx_auto_upload_table.x viz_property_group_renderer
sx_auto_upload_table.x viz_type
sx_auto_upload_table.x viz_type_property

21
superx/style/LICENSE_bulma_tooltip_1.2.0.txt
Unescape View File

@ -0,0 +1,21 @@
MIT License
Copyright (c) 2020 CreativeBulma
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

2
superx/style/bulma-tooltip.min.css vendored
View File

File diff suppressed because one or more lines are too long

27
superx/xml/js/viz/viz_functions.js
Unescape View File

@ -38,12 +38,13 @@ this.value=value;
this.isDefault=isDefault; this.isDefault=isDefault;
} }
function dimensionProperty(name,caption,isMeasure,isMandatory) function dimensionProperty(name,caption,explanation,isMeasure,isMandatory)
{ {
this.name=name; this.name=name;
this.caption=caption; this.caption=caption;
this.isMeasure=isMeasure; this.isMeasure=isMeasure;
this.isMandatory=isMandatory; this.isMandatory=isMandatory;
this.explanation=explanation;
this.getValueResultset = function () { this.getValueResultset = function () {
var valueOptions=[]; var valueOptions=[];
var optionCounter=0; var optionCounter=0;
@ -159,14 +160,14 @@ function prepareForm(vizTypeUniquename,vizTypeProperties)
if(vizTypeUniquename==vizTypeProperties[k].typeUniquename) if(vizTypeUniquename==vizTypeProperties[k].typeUniquename)
{ {
var isMeasure=(vizTypeProperties[k].groupUniquename=="MEASURE")?true:false; var isMeasure=(vizTypeProperties[k].groupUniquename=="MEASURE")?true:false;
var myProp= new dimensionProperty(vizTypeProperties[k].propUniquename,vizTypeProperties[k].caption,isMeasure,vizTypeProperties[k].isMandatory); var myProp= new dimensionProperty(vizTypeProperties[k].propUniquename,vizTypeProperties[k].caption,vizTypeProperties[k].explanation,isMeasure,vizTypeProperties[k].isMandatory);
chartProperties.push(myProp); chartProperties.push(myProp);
propertyCounter++; propertyCounter++;
} }
} }
return chartProperties; return chartProperties;
} }
/*
function prepareBarXForm() function prepareBarXForm()
{ {
var chartProperties=[]; var chartProperties=[];
@ -218,6 +219,7 @@ function prepareLineForm_alt()
return chartProperties; return chartProperties;
} }
*/
function fillDataSelectionForm(formDiv) function fillDataSelectionForm(formDiv)
{ {
formDivElem=document.getElementById(formDiv); formDivElem=document.getElementById(formDiv);
@ -419,6 +421,9 @@ function renderDimensionField(dimensionProperty)
label.classList.add("label"); label.classList.add("label");
label.classList.add("is-required"); label.classList.add("is-required");
label.classList.add("is-small"); label.classList.add("is-small");
label.classList.add("has-tooltip-right");
label.setAttribute("data-tooltip",commonChartProperty.explanation);
const textnode = document.createTextNode(dimensionProperty.caption); const textnode = document.createTextNode(dimensionProperty.caption);
label.appendChild(textnode); label.appendChild(textnode);
labelElem.appendChild(label); labelElem.appendChild(label);
@ -549,6 +554,9 @@ function renderChartPropertyField(commonChartProperty)
label.classList.add("label"); label.classList.add("label");
label.classList.add("is-required"); label.classList.add("is-required");
label.classList.add("is-small"); label.classList.add("is-small");
label.classList.add("has-tooltip-right");
label.setAttribute("data-tooltip",commonChartProperty.explanation);
const textnode = document.createTextNode(commonChartProperty.caption); const textnode = document.createTextNode(commonChartProperty.caption);
label.appendChild(textnode); label.appendChild(textnode);
labelElem.appendChild(label); labelElem.appendChild(label);
@ -556,7 +564,6 @@ function renderChartPropertyField(commonChartProperty)
//input: //input:
const inputFieldElem = document.createElement("div"); const inputFieldElem = document.createElement("div");
inputFieldElem.classList.add("field"); inputFieldElem.classList.add("field");
//inputFieldElem.classList.add("is-active");
const inputParaElem = document.createElement("p"); const inputParaElem = document.createElement("p");
inputParaElem.classList.add("control-new"); inputParaElem.classList.add("control-new");
const inputElem = document.createElement("div"); const inputElem = document.createElement("div");
@ -571,7 +578,6 @@ function renderChartPropertyField(commonChartProperty)
const selElem = document.createElement("select"); const selElem = document.createElement("select");
selElem.name=commonChartProperty.name; selElem.name=commonChartProperty.name;
selElem.id=commonChartProperty.name; selElem.id=commonChartProperty.name;
selElem.title=commonChartProperty.explanation;
//selElem.style="width:50px"; //selElem.style="width:50px";
if(commonChartProperty.variableName=="") if(commonChartProperty.variableName=="")
{ {
@ -597,7 +603,6 @@ function renderChartPropertyField(commonChartProperty)
textAreaElem.disabled="disabled"; textAreaElem.disabled="disabled";
textAreaElem.readonly="readonly"; textAreaElem.readonly="readonly";
} }
textAreaElem.title=commonChartProperty.explanation;
textAreaElem.name=commonChartProperty.name; textAreaElem.name=commonChartProperty.name;
textAreaElem.id=commonChartProperty.name; textAreaElem.id=commonChartProperty.name;
textAreaElem.value=commonChartProperty.defaultValue; textAreaElem.value=commonChartProperty.defaultValue;
@ -627,7 +632,6 @@ function renderChartPropertyField(commonChartProperty)
rangeElem.step=50; rangeElem.step=50;
*/ */
rangeElem.title=commonChartProperty.explanation;
rangeElem.name=commonChartProperty.name; rangeElem.name=commonChartProperty.name;
rangeElem.id=commonChartProperty.name; rangeElem.id=commonChartProperty.name;
rangeElem.value=commonChartProperty.defaultValue; rangeElem.value=commonChartProperty.defaultValue;
@ -640,14 +644,17 @@ function renderChartPropertyField(commonChartProperty)
default: default:
//Einfaches Texteingabefeld: //Einfaches Texteingabefeld:
const inpElem = document.createElement("input"); const inpElem = document.createElement("input");
inpElem.type=(commonChartProperty.propValueType=="integer")?"NUMBER":"TEXT"; inpElem.type="TEXT";
if(commonChartProperty.propValueType=="integer")
inpElem.type="NUMBER";
if(commonChartProperty.inputType=="COLOR")
inpElem.type="color";
inpElem.size=5; inpElem.size=5;
if(commonChartProperty.variableName=="") if(commonChartProperty.variableName=="")
{ {
inpElem.disabled="disabled"; inpElem.disabled="disabled";
inpElem.readonly="readonly"; inpElem.readonly="readonly";
} }
inpElem.title=commonChartProperty.explanation;
inpElem.name=commonChartProperty.name; inpElem.name=commonChartProperty.name;
inpElem.id=commonChartProperty.name; inpElem.id=commonChartProperty.name;
inpElem.value=commonChartProperty.defaultValue; inpElem.value=commonChartProperty.defaultValue;
@ -1187,7 +1194,7 @@ function makeDot(chartDivElem,selectionRs) {
x: categoryDim x: categoryDim
}); });
marksArray[1]=Plot.ruleY([0]); marksArray[1]=Plot.ruleY([0]);
marksArray[2]=Plot.ruleX([0]); //marksArray[2]=Plot.ruleX([0]);
var options= getChartOptions(categoryDim,"",measureDim,marksArray,true); var options= getChartOptions(categoryDim,"",measureDim,marksArray,true);

2
superx/xml/viz_html_chart.xsl
Unescape View File

@ -1282,6 +1282,8 @@ var platform='superx';
<link rel="stylesheet" type="text/css" href="../xml/css/start_portlet.css" /> <link rel="stylesheet" type="text/css" href="../xml/css/start_portlet.css" />
<link rel="stylesheet" type="text/css" href="../style/bulma.css" /> <link rel="stylesheet" type="text/css" href="../style/bulma.css" />
<link rel="stylesheet" type="text/css" href="../style/bulma-tooltip.min.css" />
<link rel="stylesheet" type="text/css" href="../style/sx_viz_muster.css" /> <link rel="stylesheet" type="text/css" href="../style/sx_viz_muster.css" />
</head> </head>

Write Preview
Loading…
Cancel
Save