From 85e3e09aa6d04d5c857cc1388c1c9dfc3f06aaae Mon Sep 17 00:00:00 2001 From: Jens Bache-Wiig Date: Wed, 18 Aug 2010 20:13:07 +0200 Subject: More polish on the graph example --- examples/graph/graph.qml | 23 +++++++++++++++-------- 1 file changed, 15 insertions(+), 8 deletions(-) diff --git a/examples/graph/graph.qml b/examples/graph/graph.qml index 8abdea8..38e399e 100644 --- a/examples/graph/graph.qml +++ b/examples/graph/graph.qml @@ -9,10 +9,10 @@ Canvas { Column { id:sliders - anchors.verticalCenter: parent.verticalCenter + y:30 anchors.right: parent.right - anchors.margins: 10 - spacing:16 + anchors.margins: 30 + spacing:12 Slider { nodecolor: "#88aaaa" ; onValueChanged:{updateCanvas()}} Slider { nodecolor: "#aa8888" ; onValueChanged:{updateCanvas()}} @@ -29,7 +29,7 @@ Canvas { var grad = ctx.createLinearGradient(0, 0, 0, height); grad.addColorStop(0, '#fff'); // red - grad.addColorStop(0.5, '#eee'); // yellow + grad.addColorStop(1, '#ccc'); // yellow ctx.fillStyle = grad; ctx.fillRect(0, 0, width, height); @@ -77,11 +77,18 @@ Canvas { xPos += horizSpace; } - ctx.strokeStyle = "rgb(110,110,110)"; - // Draw Axis - ctx.beginPath(); - ctx.moveTo(graphPadding, graphPadding); + + ctx.lineWidth = 1; + ctx.strokeStyle = "rgba(0, 0, 0, 0.05)" + for (var y = 0; y < height - graphPadding; y += height/20) { + ctx.moveTo(graphPadding, y); + ctx.lineTo(width - graphPadding, y); + } + ctx.stroke(); + + ctx.beginPath(); + ctx.moveTo(graphPadding, graphPadding); ctx.lineTo(graphPadding,cHeight - graphPadding); ctx.lineTo(cWidth - graphPadding, cHeight - graphPadding); ctx.stroke(); -- cgit v1.2.3