source: Dev/branches/Cartis/dashboardGraphSelection.php @ 227

Last change on this file since 227 was 227, checked in by cartis, 13 years ago
File size: 5.6 KB
Line 
1<?php
2/*
3 * To change this template, choose Tools | Templates
4 * and open the template in the editor.
5 */
6
7require "classes/master.php";
8
9$dbDataSelectionWidget = new dbDataSelectionWidget();
10$data = JSON_decode($_POST['selectedData']);
11?>
12
13<!DOCTYPE html>
14<html>
15    <head>
16        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
17
18        <script type="text/javascript" src="js/generalScripts.js"></script>
19        <script type="text/javascript" src="js/dashboardScripts.js"></script>
20        <script src="RGraph/libraries/RGraph.common.core.js" ></script>
21        <script src="RGraph/libraries/RGraph.common.annotate.js" ></script>
22        <script src="RGraph/libraries/RGraph.common.context.js" ></script>
23
24        <script src="RGraph/libraries/RGraph.common.tooltips.js" ></script>
25        <script src="RGraph/libraries/RGraph.common.resizing.js" ></script>
26        <script src="RGraph/libraries/RGraph.bar.js" ></script>
27        <script src="RGraph/libraries/RGraph.pie.js" ></script> 
28
29        <script>
30            myGraph.Set('chart.contextmenu', [
31                ['Get PNG', RGraph.showPNG],
32                null,
33                ['Cancel', function () {}]
34            ]);
35        </script>
36
37
38        <script>
39            window.onload = function ()
40            {
41 
42                var bar1 = new RGraph.Bar('chart1', mockupData.muData3);
43                //bar1.Set('chart.background.barcolor1', 'white');
44                // bar1.Set('chart.background.barcolor2', 'white');
45                bar1.Set('chart.labels', ['1st', '2nd', '3rd', '4th', '5th', '6th']);
46                bar1.Set('chart.key', ['John', 'Bob']);
47                bar1.Set('chart.key.position.y', 35);
48                bar1.Set('chart.key.position', 'gutter');
49                bar1.Set('chart.key.background', 'rgb(255,255,255)');
50                bar1.Set('chart.colors', ['#77f', '#7f7']);
51                bar1.Set('chart.shadow', true);
52                bar1.Set('chart.shadow.blur', 15);
53                bar1.Set('chart.shadow.offsetx', 0);
54                bar1.Set('chart.shadow.offsety', 0);
55                bar1.Set('chart.shadow.color', '#aaa');
56                bar1.Set('chart.yaxispos', 'right');
57                bar1.Set('chart.strokestyle', 'rgba(0,0,0,0)');
58                bar1.Set('chart.gutter.left', 5);
59                bar1.Set('chart.gutter.right', 45);
60                bar1.Draw();
61 
62               
63           
64                if (!RGraph.isIE8()) {
65                    tooltipFunc = function (i)
66                    {
67                        var r = i % 4;
68                   
69                        if (r == 3) return 'John'
70                        else if (r == 2) return 'Rich';
71                        else if (r == 1) return 'Jane';
72                        else if (r == 0) return 'Quentin';
73                    }
74                    bar2.Set('chart.tooltips', tooltipFunc);
75                }
76 
77                bar2.Draw();
78               
79            }
80        </script>
81
82        <title>
83            Dashboard Graph Selection
84        </title>
85        <?php new Stylesheet("visualEditors"); ?>
86
87    </head>
88
89    <body>
90        <div id="header">
91            <?php new Logo(); ?>
92        </div>
93
94        <div id="content">
95            <div id="wrapper">
96
97                <div id="leftColumn">
98
99                    <div class="largeFrame C" id="dbDataSelector">
100                        <div class="content">
101
102                            <div class="largeTitle">Selected data</div>                         
103                            <div class="content" style="width: 300px; height: 500px; ">               
104
105                                <?php
106                                print_r($data);
107                                ?>
108
109                            </div>
110
111                        </div>
112                    </div>
113                </div>
114
115                <div id="rightColumn">
116                    <div class="largeFrame Cv" style="width: 600px; height: 400px;">
117                        <div class="largeTitle">Graph selection</div>
118                        <div class="topControls" id="graphTypeSelector" style="float: left; clear: left; width: 100%; margin: 0; border: 1px solid #000;">
119                            <div id="btnSelectPieType" class="graphSelectionButton" onclick="changeGraphType('pie')">PIE CHART</div>
120                            <div id="btnSelectBarType" class="graphSelectionButton" onclick="changeGraphType('bar')">BAR CHART</div>
121                            <div id="btnSelectRadarType" class="graphSelectionButton" onclick="changeGraphType('radar')">RADAR CHART</div>
122                        </div>
123                        <div class="content" id="graphDisplay">
124
125                            <canvas id="chart1" width="450" height="200" onclick="RGraph.showPNG(document.getElementById('bar1'));">[No canvas support] </canvas>
126
127                            <!-- Button to gotoDashboard?? -->                                                           
128
129                        </div>
130
131                        <div class="controls">
132                            <input type="button" class="smallButton" value="Save to dashboard" onClick="addToDashboard()"></input>
133                            <input type="button" class="smallButton" value="Go to Dashboard" onClick="gotoDashboard()"></input>
134
135                        </div>
136
137                    </div>
138                </div>
139
140
141                <div class="largeFrame Cu" id="dbInfoPanel" style="width: 930px;">
142                    <div class='largeTitle'>Info panel</div>
143                    <div class="content" id="dbInfoPanelContent" style="height: 100px;">
144
145                    </div>
146
147
148                </div>
149            </div>
150
151
152
153    </body>
154</html>
Note: See TracBrowser for help on using the repository browser.