Changeset 2040


Ignore:
Timestamp:
Sep 29, 2011, 4:02:17 PM (9 years ago)
Author:
tjeerd@…
Message:

VIS-17, finaly all visualizations are present. There is still a problem with treating categorial and numerical axis in different ways, so this Issue will not be closed.

Location:
trunk/web-app
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/web-app/css/visualization.css

    r2022 r2040  
    88}
    99
     10/** START :: TABLE VISUALIZATION **/
     11
     12table.tablevis {
     13    border-style: none;
     14}
     15
     16table.tablevis th {
     17    font-weight: bold;
     18    padding: 5px 6px;
     19    background: none;
     20    background-color: #fafad2;
     21    border: 1px solid #CCCCCC;
     22    color: #444444;
     23}
     24
     25table.tablevis td {
     26    border: 1px solid #CCCCCC;
     27}
     28
     29table.tablevis td.caption {
     30    border-style: none;
     31    text-align: center;
     32    vertical-align: middle;
     33    font-style: italic;
     34}
    1035
    1136/** START :: MESSAGES**/
  • trunk/web-app/js/visualization.js

    r2034 r2040  
    283283                                break;
    284284                        case "scatterplot":
    285                                 alert( "I'm sorry, this visualization type is not implemented yet.")
    286                                 break;
     285
     286                        series[0].showLine = false;
     287                        series[0].markerOptions = { "size": 5, "style":"filledCircle" };
     288
     289                                plotOptions = {
     290                            stackSeries: true,
     291                            seriesDefaults:{
     292                                renderer:$.jqplot.LineRenderer
     293                            },
     294                            series: series,
     295                            highlighter: {
     296                                show: true,
     297                                sizeAdjust: 7.5
     298                            },
     299                            axes: {
     300                                xaxis: {
     301                                    renderer: $.jqplot.CategoryAxisRenderer,
     302                                    ticks: returnData.series[ 0 ].x,    // Use the x-axis of the first serie
     303                                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
     304                                    label: xlabel
     305                                },
     306                                yaxis: {
     307                                    label: ylabel,
     308                                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
     309                                    formatString:'%.2f'
     310                                }
     311                            }
     312                        };
    287313                        case "linechart":
    288314                        plotOptions = {
     
    300326                                    renderer: $.jqplot.CategoryAxisRenderer,
    301327                                    ticks: returnData.series[ 0 ].x,    // Use the x-axis of the first serie
    302                                     label: xlabel,
    303                                     labelRenderer: $.jqplot.CanvasAxisLabelRenderer
     328                                    labelRenderer: $.jqplot.CanvasAxisLabelRenderer,
     329                                    label: xlabel
    304330                                },
    305331                                yaxis: {
     
    318344                                renderer:$.jqplot.BarRenderer,
    319345                                rendererOptions: {
    320                                         // Put a 30 pixel margin between bars.
    321                                         barMargin: 30,
    322                                         // Highlight bars when mouse button pressed.
    323                                         // Disables default highlighting on mouse over.
    324                                         highlightMouseDown: true
     346                                    // Put a 30 pixel margin between bars.
     347                                    barMargin: 30,
     348                                    // Highlight bars when mouse button pressed.
     349                                    // Disables default highlighting on mouse over.
     350                                    highlightMouseDown: true
    325351                                }
    326352                            },
     
    347373                                break;
    348374                        case "table":
    349                                 alert( "I'm sorry, this visualization type is not implemented yet.")
     375                        // create table
     376                        var table = $("<table>").addClass("tablevis");
     377
     378                        // create caption-row
     379                        var row = $("<tr>");
     380                        // create empty top-left-field
     381                        row.append("<td class='caption' colspan='2' rowspan='2'>&nbsp;</td>");
     382                        // create caption
     383                        row.append("<td class='caption' colspan='"+returnData.series[0].x.length+"'>"+xlabel+"</td>");
     384                        row.appendTo(table);
     385
     386                        // create header-row
     387                        var row = $("<tr>");
     388                        // create headers
     389                        for(j=0; j<returnData.series[0].x.length; j++) {
     390                            row.append("<th>"+returnData.series[0].x[j]+"</th>");
     391                        }
     392                        row.appendTo(table);
     393
     394                        // create data-rows
     395                        for(i=0; i<returnData.series[0].y.length; i++) {
     396                            var row = $("<tr>");
     397                            for(j=-1; j<returnData.series[0].x.length; j++) {
     398                                if(j<0) {
     399                                    if(i==0) {
     400                                        // create caption-column
     401                                        row.append("<td class='caption' rowspan='"+returnData.series[0].y.length+"'>"+ylabel+"</td>");
     402                                    }
     403
     404                                    // create row-header
     405                                    row.append("<th>"+returnData.series[0].y[i]+"</th>");
     406                                } else {
     407                                    // row-data
     408                                    row.append("<td>"+returnData.series[0].data[j][i]+"</td>");
     409                                }
     410                            }
     411                            row.appendTo(table);
     412                        }
     413
     414                        plotOptions = table;
    350415                                break;
    351416                }
     
    353418                // If a chart has been created, show it
    354419                if( plotOptions != null ) {
    355                     visualization = $.jqplot('visualization', dataPoints, plotOptions );                       
     420                    $( "#visualization" ).empty();
     421                    if(returnData.type=="table") {
     422                        $( "#visualization" ).html(plotOptions);
     423                    } else {
     424                        visualization = $.jqplot('visualization', dataPoints, plotOptions );
     425                    }
    356426                    $( "#visualization" ).show();
    357427                }
Note: See TracChangeset for help on using the changeset viewer.