Ignore:
Timestamp:
01/12/12 17:30:32 (13 years ago)
Author:
cartis
Message:
 
File:
1 edited

Legend:

Unmodified
Added
Removed

  • Dev/branches/Cartis/dashboardGraphSelection.php

    r214 r227  
    88
    99$dbDataSelectionWidget = new dbDataSelectionWidget();
    10 
    1110$data = JSON_decode($_POST['selectedData']);
    1211?>
    … …  
    1716        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    1817
     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
    1982        <title>
    2083            Dashboard Graph Selection
    … …  
    2386
    2487    </head>
    25    
     88
    2689    <body>
    2790        <div id="header">
    … …  
    39102                            <div class="largeTitle">Selected data</div>                         
    40103                            <div class="content" style="width: 300px; height: 500px; ">               
     104
    41105                                <?php
    42106                                print_r($data);
    43                                 ?>
     107                                ?>
     108
    44109                            </div>
    45 
    46                         </div>
    47                     </div>
    48 
    49                     <div id="rightColumn">
    50                         <div class="largeFrame Cv" style="width: 600px; height: 400px;">
    51                             <div class="largeTitle">Graph selection</div>
    52                             <div class="content">
    53                                 <img src="images/icons/nyan.gif" width="595" height="370"></img>
    54                             </div>
    55 
    56                         </div>
    57                     </div>
    58 
    59 
    60                     <div class="largeFrame Cu" id="dbInfoPanel" style="width: 930px;">
    61                         <div class='largeTitle'>Info panel</div>
    62                         <div class="content" id="dbInfoPanelContent" style="height: 100px;">
    63110
    64111                        </div>
    … …  
    66113                </div>
    67114
     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">
    68124
    69                 </body>
    70                 </html>
     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 TracChangeset for help on using the changeset viewer.