Skip to content

Commit

Permalink
Merge pull request #834 from KomodoPlatform/fix_chart_line
Browse files Browse the repository at this point in the history
fix(fix_chart_line): set to chart line default color
  • Loading branch information
Milerius authored Apr 20, 2021
2 parents c9aee18 + f7d0e64 commit 9f01c07
Show file tree
Hide file tree
Showing 4 changed files with 58 additions and 161 deletions.
1 change: 1 addition & 0 deletions assets/themes/Light.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
"buttonColorTextEnabled": "#405366",
"buttonColorTextHovered": "#405366",
"chartTheme": "light",
"chartGridLineColor":"#707070",
"chartTradingLineBackgroundColor": "#e3f2fd",
"chartTradingLineColor": "#37a6ef",
"colorInnerShadowBottom": "#dddddd",
Expand Down
3 changes: 2 additions & 1 deletion atomic_defi_design/qml/App.qml
Original file line number Diff line number Diff line change
Expand Up @@ -366,7 +366,8 @@ Rectangle {

property color chartTradingLineColor: Style.colorTrendingLine
property color chartTradingLineBackgroundColor: Style.colorTrendingUnderLine
property color lineChartColor: "#277AD5"//Qt.lighter(theme.accentColor)
property color lineChartColor: theme.accentColor
property color chartGridLineColor: Qt.rgba(255,255,255,0.4)

property color foregroundColor: Style.colorText

Expand Down
209 changes: 52 additions & 157 deletions atomic_defi_design/qml/Portfolio/AmountChart.qml
Original file line number Diff line number Diff line change
Expand Up @@ -88,39 +88,10 @@ InnerBackground {
ClipRRect {
anchors.fill: parent
radius: parent.radius
/*Glow {
id: glow
anchors.fill: chart_2
radius: 8
samples: 168
color: 'purple'
source: chart_2
}
LinearGradient {
id: gradient
start: Qt.point(portfolio_asset_chart.mX,portfolio_asset_chart.mY-100)
end: Qt.point(portfolio_asset_chart.mX,portfolio_asset_chart.mY+100)
gradient: Gradient {
GradientStop {
position: 1;
color: theme.accentColor
}
GradientStop {
position: 0.3;
color: Qt.rgba(86,128,189,0.09)
}
GradientStop {
position: 0.2;
color: Qt.rgba(86,128,189,0.00)
}
}
anchors.fill: glow
source: glow
}*/


ChartView {
id: chart_2
title: "View"
anchors.fill: parent
anchors.margins: -20
anchors.topMargin: 50
Expand All @@ -140,13 +111,14 @@ InnerBackground {
gridVisible: false
lineVisible: false
format: "<br>MMM d"
labelsColor: theme.foregroundColor
}
axisY: ValueAxis {
lineVisible: false
max: parseFloat(API.app.portfolio_pg.max_total_chart)
min: parseFloat(API.app.portfolio_pg.min_total_chart)

gridLineColor: Qt.rgba(77,198,255,0.12)
labelsColor: theme.foregroundColor
gridLineColor: theme.chartGridLineColor
}
color: Qt.rgba(77,198,255,0.02)
borderColor: 'transparent'
Expand All @@ -158,6 +130,7 @@ InnerBackground {
visible: false
max: parseFloat(API.app.portfolio_pg.max_total_chart)
min: parseFloat(API.app.portfolio_pg.min_total_chart)
color: theme.foregroundColor
}
axisX: DateTimeAxis {
id: dateA2
Expand All @@ -169,93 +142,29 @@ InnerBackground {
}

}
/*onHovered: {
let p = chart_2.mapToValue(point, area)
console.log(p)
if(p.x<170) {
boxi.x = p.x
}else {
boxi.x = p.x-170
}
boxi.y = p.y+10
if(state){
boxi.visible = true
}else {
boxi.visible = false
}
boxi.value = point.y
boxi.timestamp = point.x
}*/
}
MouseArea {
id: mouse_area
width: parent.width
Qaterial.ClipRRect {
width: parent.width-110
anchors.horizontalCenterOffset: 10
height: parent.height
x: -40
hoverEnabled: true
onPositionChanged: {
let point = Qt.point(mouseX, mouseY)
let p = chart_2.mapToValue(point, area)
let idx = API.app.portfolio_pg.get_neareast_point(Math.floor(p.x) / 1000);
let pos = areaLine3.at(idx);
//console.log("p.x: " + Math.floor(p.x) + " p.y: " + p.y)

//chart_2.title = pos.x.toFixed(0) + " - " + pos.y.toFixed(0)

//let value = areaLine3.at(p.x)
let chartPosition = chart_2.mapToPosition(pos, areaLine3)
//console.log(chartPosition)

anchors.horizontalCenter: parent.horizontalCenter
Rectangle {
id: verticalLine
height: parent.height-84
opacity: .7
visible: mouse_area.containsMouse && mouse_area.mouseX>60
anchors.verticalCenterOffset: -6
anchors.verticalCenter: parent.verticalCenter
width: 3
radius: 4

if(mouseX<170) {
boxi.x = mouseX
}else {
boxi.x = mouseX-170
}
myCanvas.xx = mouseX
myCanvas.yy = chartPosition.y
myCanvas.requestPaint()


boxi.y = chartPosition.y+10
boxi.visible = true
boxi.value = pos.y
boxi.timestamp = pos.x
border.color: theme.accentColor
color: theme.foregroundColor
x: mouse_area.mouseX-80
}

}
Canvas{
id:myCanvas
anchors.fill: chart_2
property double xx: 0
property double yy: 0
visible: mouse_area.containsMouse
onPaint: {
if(xx+yy>0){
var ctx = getContext ("2d") // Draw cross cross vertical line
ctx.clearRect(0,0,parent.width,parent.height)
ctx.strokeStyle = theme.lineChartColor
ctx.lineWidth = 3
ctx.beginPath()
ctx.arc(xx, yy-4, 8, 0, 2 * Math.PI, false);
context.fillStyle = theme.lineChartColor;
context.fill();
ctx.moveTo(xx,chart_2.plotArea.y)
ctx.lineTo(xx,chart_2.plotArea.height+chart_2.plotArea.y)
ctx.stroke()

//ctx.beginPath () // Draw cross cross horizontal line
//ctx.moveTo(chart_2.plotArea.x,yy)
//ctx.lineTo(chart_2.plotArea.x+chart_2.plotArea.width,yy)
//ctx.stroke()
} else {// Mouse leaves the chart area to clear the cross line
var ctx = getContext("2d")
ctx.clearRect(0,0,parent.width,parent.height)
}
}
}

LineSeries {
id: areaLine3
color: theme.accentColor
Expand All @@ -265,6 +174,8 @@ InnerBackground {
visible: false
max: parseFloat(API.app.portfolio_pg.max_total_chart)
min: parseFloat(API.app.portfolio_pg.min_total_chart)
gridLineColor: 'red'
labelsColor: 'red'//theme.foregroundColor
}
axisX: DateTimeAxis {
visible: false
Expand All @@ -273,55 +184,39 @@ InnerBackground {
gridVisible: false
lineVisible: false
format: "MMM d"
gridLineColor: 'red'
labelsColor: 'red'//theme.foregroundColor
}
}

/*ScatterSeries {
id: scatter
visible: true
color: theme.accentColor
borderColor: theme.accentColor
markerSize: 1
borderWidth: 3
onHovered: {
let p = chart_2.mapToPosition(point, scatter)
if(p.x<170) {
boxi.x = p.x
}else {
boxi.x = p.x-170
}
boxi.y = p.y+10
if(state){
boxi.visible = true
MouseArea {
id: mouse_area
width: parent.width+200
height: parent.height
x: -40
hoverEnabled: true
onPositionChanged: {
let mx = mouseX
//console.log(mx)
let point = Qt.point(mx, mouseY)
let p = chart_2.mapToValue(point, area)
let idx = API.app.portfolio_pg.get_neareast_point(Math.floor(p.x) / 1000);
let pos = areaLine3.at(idx);
let chartPosition = chart_2.mapToPosition(pos, areaLine3)

if(mx<170) {
boxi.x = mx
}else {
boxi.visible = false
boxi.x = mx-170
}
boxi.value = point.y
boxi.timestamp = point.x
}

axisY: ValueAxis {
visible: false
max: parseFloat(API.app.portfolio_pg.max_total_chart)
min: parseFloat(API.app.portfolio_pg.min_total_chart)
}
axisX: DateTimeAxis {
visible: false
min: dateA.min
max: dateA.max
gridVisible: false
lineVisible: false
format: "MMM d"
boxi.y = chartPosition.y+10
boxi.value = pos.y
boxi.timestamp = pos.x
}
}*/
}
}



Rectangle {
anchors.fill: parent
Expand Down Expand Up @@ -389,7 +284,7 @@ InnerBackground {
id: boxi
property real value: 0
property var timestamp
visible: mouse_area.containsMouse
visible: mouse_area.containsMouse && mouse_area.mouseX>60
width: 130
height: 60
x: 99999
Expand Down
6 changes: 3 additions & 3 deletions atomic_defi_design/qml/Portfolio/AssetPieChart.qml
Original file line number Diff line number Diff line change
Expand Up @@ -165,8 +165,8 @@ Item {
height: width
color: 'transparent'
radius: width/2
border.width: 0
border.color: theme.backgroundColor
border.width: API.app.portfolio_pg.balance_fiat_all>0 ? 0 : 5
border.color: Qt.lighter(theme.backgroundColor)
}
}

Expand Down Expand Up @@ -228,7 +228,7 @@ Item {
}

DexLabel {
text: percent_main_currency
text: percent_main_currency +" %"
Component.onCompleted: font.family = 'lato'
Layout.alignment: Qt.AlignVCenter
}
Expand Down

0 comments on commit 9f01c07

Please sign in to comment.