Skip to content

Commit c5cc860

Browse files
fuchsvomwaldefuchsvomwalde
committed
Fix: data points don't appear in the right position
1 parent 21647ca commit c5cc860

File tree

3 files changed

+182
-5
lines changed

3 files changed

+182
-5
lines changed

‎src/demo/playground.controller.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ sap.ui.define(['sap/ui/core/mvc/Controller'], function(Controller) {
6969
{ low: null, high: null, type: ui5.viz.DataPointType.ValuePair },
7070
{ low: null, high: null, type: ui5.viz.DataPointType.ValuePair }
7171
],
72-
color: ui5.viz.hexToRgba(aColorPalette[0], 0.2),
72+
color: aColorPalette[0],
7373
type: ui5.viz.ChartSeriesType.RibbonSpline
7474
},
7575
{

‎src/ui5/viz/ChartDataPoint.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -225,7 +225,7 @@ sap.ui.define(['sap/ui/core/Element', './library'], function(Element, library) {
225225
*/
226226
getValue() {
227227
var v = this.getProperty('value')
228-
return !isNaN(v) && v !== null ? parseInt(v, 10) : null
228+
return !isNaN(v) && v !== null ? parseFloat(v) : null
229229
},
230230

231231
/**
@@ -234,7 +234,7 @@ sap.ui.define(['sap/ui/core/Element', './library'], function(Element, library) {
234234
*/
235235
getHigh() {
236236
var h = this.getProperty('high')
237-
return !isNaN(h) && h !== null ? parseInt(h, 10) : null
237+
return !isNaN(h) && h !== null ? parseFloat(h) : null
238238
},
239239

240240
/**
@@ -243,7 +243,7 @@ sap.ui.define(['sap/ui/core/Element', './library'], function(Element, library) {
243243
*/
244244
getLow() {
245245
var l = this.getProperty('low')
246-
return !isNaN(l) && l !== null ? parseInt(l, 10) : null
246+
return !isNaN(l) && l !== null ? parseFloat(l) : null
247247
},
248248

249249
/**

‎src/ui5/viz/libs/c3.css‎

Lines changed: 178 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,178 @@
1-
.c3 svg{font:10px sans-serif;-webkit-tap-highlight-color:transparent}.c3 line,.c3 path{fill:none;stroke:#000}.c3 text{-webkit-user-select:none;-moz-user-select:none;user-select:none}.c3-bars path,.c3-event-rect,.c3-legend-item-tile,.c3-xgrid-focus,.c3-ygrid{shape-rendering:crispEdges}.c3-chart-arc path{stroke:#fff}.c3-chart-arc rect{stroke:#fff;stroke-width:1}.c3-chart-arc text{fill:#fff;font-size:13px}.c3-grid line{stroke:#aaa}.c3-grid text{fill:#aaa}.c3-xgrid,.c3-ygrid{stroke-dasharray:3 3}.c3-text.c3-empty{fill:grey;font-size:2em}.c3-line{stroke-width:1px}.c3-circle._expanded_{stroke-width:1px;stroke:#fff}.c3-selected-circle{fill:#fff;stroke-width:2px}.c3-bar{stroke-width:0}.c3-bar._expanded_{fill-opacity:1;fill-opacity:.75}.c3-target.c3-focused{opacity:1}.c3-target.c3-focused path.c3-line,.c3-target.c3-focused path.c3-step{stroke-width:2px}.c3-target.c3-defocused{opacity:.3!important}.c3-region{fill:#4682b4;fill-opacity:.1}.c3-brush .extent{fill-opacity:.1}.c3-legend-item{font-size:12px}.c3-legend-item-hidden{opacity:.15}.c3-legend-background{opacity:.75;fill:#fff;stroke:#d3d3d3;stroke-width:1}.c3-title{font:14px sans-serif}.c3-tooltip-container{z-index:10}.c3-tooltip{border-collapse:collapse;border-spacing:0;background-color:#fff;empty-cells:show;-webkit-box-shadow:7px 7px 12px -9px #777;-moz-box-shadow:7px 7px 12px -9px #777;box-shadow:7px 7px 12px -9px #777;opacity:.9}.c3-tooltip tr{border:1px solid #ccc}.c3-tooltip th{background-color:#aaa;font-size:14px;padding:2px 5px;text-align:left;color:#fff}.c3-tooltip td{font-size:13px;padding:3px 6px;background-color:#fff;border-left:1px dotted #999}.c3-tooltip td>span{display:inline-block;width:10px;height:10px;margin-right:6px}.c3-tooltip td.value{text-align:right}.c3-area{stroke-width:0;opacity:.2}.c3-chart-arcs-title{dominant-baseline:middle;font-size:1.3em}.c3-chart-arcs .c3-chart-arcs-background{fill:#e0e0e0;stroke:#fff}.c3-chart-arcs .c3-chart-arcs-gauge-unit{fill:#000;font-size:16px}.c3-chart-arcs .c3-chart-arcs-gauge-max,.c3-chart-arcs .c3-chart-arcs-gauge-min{fill:#777}.c3-chart-arc .c3-gauge-value{fill:#000}.c3-chart-arc.c3-target g path,.c3-chart-arc.c3-target.c3-focused g path{opacity:1}
1+
/*-- Chart --*/
2+
.c3 svg {
3+
font: 10px sans-serif;
4+
-webkit-tap-highlight-color: transparent; }
5+
6+
.c3 path, .c3 line {
7+
fill: none;
8+
stroke: #000; }
9+
10+
.c3 text {
11+
-webkit-user-select: none;
12+
-moz-user-select: none;
13+
user-select: none; }
14+
15+
.c3-legend-item-tile,
16+
.c3-xgrid-focus,
17+
.c3-ygrid,
18+
.c3-event-rect,
19+
.c3-bars path {
20+
shape-rendering: crispEdges; }
21+
22+
.c3-chart-arc path {
23+
stroke: #fff; }
24+
25+
.c3-chart-arc rect {
26+
stroke: white;
27+
stroke-width: 1; }
28+
29+
.c3-chart-arc text {
30+
fill: #fff;
31+
font-size: 13px; }
32+
33+
/*-- Axis --*/
34+
/*-- Grid --*/
35+
.c3-grid line {
36+
stroke: #aaa; }
37+
38+
.c3-grid text {
39+
fill: #aaa; }
40+
41+
.c3-xgrid, .c3-ygrid {
42+
stroke-dasharray: 3 3; }
43+
44+
/*-- Text on Chart --*/
45+
.c3-text.c3-empty {
46+
fill: #808080;
47+
font-size: 2em; }
48+
49+
/*-- Line --*/
50+
.c3-line {
51+
stroke-width: 1px; }
52+
53+
/*-- Point --*/
54+
.c3-circle._expanded_ {
55+
stroke-width: 1px;
56+
stroke: white; }
57+
58+
.c3-selected-circle {
59+
fill: white;
60+
stroke-width: 2px; }
61+
62+
/*-- Bar --*/
63+
.c3-bar {
64+
stroke-width: 0; }
65+
66+
.c3-bar._expanded_ {
67+
fill-opacity: 1;
68+
fill-opacity: 0.75; }
69+
70+
/*-- Focus --*/
71+
.c3-target.c3-focused {
72+
opacity: 1; }
73+
74+
.c3-target.c3-focused path.c3-line, .c3-target.c3-focused path.c3-step {
75+
stroke-width: 2px; }
76+
77+
.c3-target.c3-defocused {
78+
opacity: 0.3 !important; }
79+
80+
/*-- Region --*/
81+
.c3-region {
82+
fill: steelblue;
83+
fill-opacity: .1; }
84+
85+
/*-- Brush --*/
86+
.c3-brush .extent {
87+
fill-opacity: .1; }
88+
89+
/*-- Select - Drag --*/
90+
/*-- Legend --*/
91+
.c3-legend-item {
92+
font-size: 12px; }
93+
94+
.c3-legend-item-hidden {
95+
opacity: 0.15; }
96+
97+
.c3-legend-background {
98+
opacity: 0.75;
99+
fill: white;
100+
stroke: lightgray;
101+
stroke-width: 1; }
102+
103+
/*-- Title --*/
104+
.c3-title {
105+
font: 14px sans-serif; }
106+
107+
/*-- Tooltip --*/
108+
.c3-tooltip-container {
109+
z-index: 10; }
110+
111+
.c3-tooltip {
112+
border-collapse: collapse;
113+
border-spacing: 0;
114+
background-color: #fff;
115+
empty-cells: show;
116+
-webkit-box-shadow: 7px 7px 12px -9px #777777;
117+
-moz-box-shadow: 7px 7px 12px -9px #777777;
118+
box-shadow: 7px 7px 12px -9px #777777;
119+
opacity: 0.9; }
120+
121+
.c3-tooltip tr {
122+
border: 1px solid #CCC; }
123+
124+
.c3-tooltip th {
125+
background-color: #aaa;
126+
font-size: 14px;
127+
padding: 2px 5px;
128+
text-align: left;
129+
color: #FFF; }
130+
131+
.c3-tooltip td {
132+
font-size: 13px;
133+
padding: 3px 6px;
134+
background-color: #fff;
135+
border-left: 1px dotted #999; }
136+
137+
.c3-tooltip td > span {
138+
display: inline-block;
139+
width: 10px;
140+
height: 10px;
141+
margin-right: 6px; }
142+
143+
.c3-tooltip td.value {
144+
text-align: right; }
145+
146+
/*-- Area --*/
147+
.c3-area {
148+
stroke-width: 0;
149+
opacity: 0.2; }
150+
151+
/*-- Arc --*/
152+
.c3-chart-arcs-title {
153+
dominant-baseline: middle;
154+
font-size: 1.3em; }
155+
156+
.c3-chart-arcs .c3-chart-arcs-background {
157+
fill: #e0e0e0;
158+
stroke: #FFF; }
159+
160+
.c3-chart-arcs .c3-chart-arcs-gauge-unit {
161+
fill: #000;
162+
font-size: 16px; }
163+
164+
.c3-chart-arcs .c3-chart-arcs-gauge-max {
165+
fill: #777; }
166+
167+
.c3-chart-arcs .c3-chart-arcs-gauge-min {
168+
fill: #777; }
169+
170+
.c3-chart-arc .c3-gauge-value {
171+
fill: #000;
172+
/* font-size: 28px !important;*/ }
173+
174+
.c3-chart-arc.c3-target g path {
175+
opacity: 1; }
176+
177+
.c3-chart-arc.c3-target.c3-focused g path {
178+
opacity: 1; }

0 commit comments

Comments
 (0)