jQWidgets Forums

Forum Replies Created

Viewing 15 posts - 1 through 15 (of 33 total)

1 2 3 →

Author

Posts

June 8, 2018 at 1:07 pm in reply to: Aggregates vs. SubAggregates Aggregates vs. SubAggregates #100534

Participant

Additional Info. I did find a forum entry about changing color, but I can’t get it to work… Both aggregate and subAggregate are still grey..

  // prepare the data
        var source2 = {            
              localdata: myTree,
              datatype: "array",
              hierarchy: {
                groupingDataFields: [{
                    name: "cloud_offering"
                }]
            }
        };
		
        // create and bind the data adapter.
        var dataAdapter2 = new $.jqx.dataAdapter(source2);
        dataAdapter2.dataBind();
        

         // Now set the background color of the aggregates to lightblue.
        // Does not work though...
         $('#idTreeGrid').on('bindingComplete', function (event) {
                 $('#statusrowidTreeGrid').children().css("background-color", "lightblue")
             });
        
        
        // create Tree Grid
        $("#idTreeGrid").jqxTreeGrid({
            width: '100%',
            //width: graphWidth,
            theme: 'light',
            source: dataAdapter2,
            //pageable: true,
            columnsResize: true,
            altRows: true,
            showAggregates: true,
            showSubAggregates: true,
            aggregatesHeight: 100,
            icons: function(rowKey, rowData) {
                var level = rowData.level;
                if (level == 0) {
                    // each group row has a label member that contains the information displayed on the group row.
                    //var country = rowData.label;
                    //return "../../images/" + $.trim(country.toLowerCase()) + ".png";
                    return "#WORKSPACE_IMAGES#images/small_checkmark.png";
                }
                return false;
            },              
            ready: function() {
                $("#idTreeGrid").jqxTreeGrid('expandRow', "0");
            },
            columns: [{
                    text: 'Product Name',
                    dataField: 'product_name',
                    width: 350
                },
                {
                    text: 'Product Detail',
                    dataField: 'product_detail',
                   // minWidth: 300,
                   // width: 700
                },
                      
                {
                    text: 'Order #',
                    dataField: 'sales_order_number',
                    width: 100
                },
                      
                {
                    text: 'Used Amount',
                    dataField: 'used_amount_raw',
                    cellsFormat: "c2",
                    width: 150,
                    align: 'right', cellsAlign: 'right',
                    aggregates: ['sum', 'max', 'count']
                }
            ]
        });

June 4, 2018 at 3:47 pm in reply to: Tooltips do not change locations Tooltips do not change locations #100472

George S

Participant

Issue resolved. The culprit turns out to be the inclusion of JQuery Migrate. Specifically 3.0.0. Note that 3.0.1 does not have the issue.
Thank you,
George S

June 1, 2018 at 4:26 pm in reply to: Questions on Chart Legend Questions on Chart Legend #100440

George S

Participant

Sorry, wrong forum. Will repost of Chart Forum

October 3, 2017 at 10:42 am in reply to: Rowheight in jqxPivotGrid Rowheight in jqxPivotGrid #96482

George S

Participant

Any update on when this will be fixed?

Thank you,
George S

September 22, 2017 at 11:16 am in reply to: Rowheight in jqxPivotGrid Rowheight in jqxPivotGrid #96247

George S

Participant

OK, so I have down to a complete working example of the issue. This issue happens in both Firefox and Chrome browsers. I did not test IE. To show the problem, save the code as an HTML file and open it in a browser. You will see the Designer and PivotGrid. Pick up the COUNTRY column from the ROWS section, and move it to the FILTERS section. The grid will NOT be updated, and you will see the new location of COUNTRY, as well as a copy of the COUNTRY field, as if it was not being properly erased from the graphics display.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
  <meta content="utf-8" http-equiv="encoding">
   
    <link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css" type="text/css" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1 minimum-scale=1" />	
    <link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.light.css" type="text/css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
	 
	
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxdata.js"></script> 
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxcheckbox.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxinput.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxwindow.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxdragdrop.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxpivot.js"></script> 
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxpivotgrid.js"></script>
    <script type="text/javascript" src="http://jqwidgets.com/public/jqwidgets/jqxpivotdesigner.js"></script>

   <script type="text/javascript" src="http://www.jqwidgets.com/jquery-widgets-demo/scripts/demos.js"></script>  
	
	</head> 
	<body class='default'> 
     <script>
        $(document).ready(function () {
            // prepare sample data
            var data = new Array();

            var countries =
            [
                "Germany", "France", "United States", "Italy", "Spain", "Finland", "Canada", "Japan", "Brazil", "United Kingdom", "China", "India", "South Korea", "Romania", "Greece"
            ];

            var dataPoints =
            [
                "2.25", "1.5", "3.0", "3.3", "4.5", "3.6", "3.8", "2.5", "5.0", "1.75", "3.25", "4.0"
            ];

            for (var i = 0; i < countries.length * 2; i++) {
                var row = {};
                var value = parseFloat(dataPoints[Math.round((Math.random() * 100)) % dataPoints.length]);

                row["country"] = countries[i % countries.length];
                row["value"] = value;

                data[i] = row;
            }

            // create a data source and data adapter
            var source =
            {
                localdata: data,
                datatype: "array",
                datafields:
                [
                    { name: 'country', type: 'string' },
                    { name: 'value', type: 'number' }
                ]
            };

            var dataAdapter = new $.jqx.dataAdapter(source);
            dataAdapter.dataBind();

            // create a pivot data source from the dataAdapter
            var pivotDataSource = new $.jqx.pivot(
                dataAdapter,
                {
                    pivotValuesOnRows: false,
                    rows: [{ dataField: 'country', width: 190 }],
                    columns: [],
                    values: [
                        { dataField: 'value', width: 200, 'function': 'min', text: 'cells left alignment', formatSettings: { align: 'left', prefix: '', decimalPlaces: 2 } },
                        { dataField: 'value', width: 200, 'function': 'max', text: 'cells center alignment', formatSettings: { align: 'center', prefix: '', decimalPlaces: 2 } },
                        { dataField: 'value', width: 200, 'function': 'average', text: 'cells right alignment', formatSettings: { align: 'right', prefix: '', decimalPlaces: 2 } }
                    ]
                });
			
			var localization = { 'var': 'Variance' };

			// create a pivot grid
            $('#divPivotGrid').jqxPivotGrid(
            {
                localization: localization,
                source: pivotDataSource,
                treeStyleRows: false,
                autoResize: false,
                multipleSelectionEnabled: true
            });
			
            var pivotGridInstance = $('#divPivotGrid').jqxPivotGrid('getInstance');
            // create a pivot grid
            $('#divPivotGridDesigner').jqxPivotDesigner(
            {
                type: 'pivotGrid',
                target: pivotGridInstance
            });
        });

    </script>
    <table>
        <tr>
            <td>
                <div id="divPivotGridDesigner" style="height: 400px; width: 250px;">
                </div>
            </td>
            <td>
                <div id="divPivotGrid" style="height: 400px; width: 550px;">
                </div>
            </td>
        </tr>
    </table>   
</body>
</html>

September 18, 2017 at 5:24 pm in reply to: Rowheight in jqxPivotGrid Rowheight in jqxPivotGrid #96100

George S

Participant

Additional information. The above graphic is caused by picking up the FY-QTR column and moving it from ‘Columns’ to ‘Filters’. Why the column moves, it leaves a ghost-image, or after image, and it does NOT refresh the Grid.

September 18, 2017 at 5:22 pm in reply to: Rowheight in jqxPivotGrid Rowheight in jqxPivotGrid #96099

George S

Participant

I am starting to think that it is a CSS issue, although I can’t figure out why.
I am using ONLY the following CSS

https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css
https://jqwidgets.com/public/jqwidgets/styles/jqx.light.css
https://jqwidgets.com/public/jqwidgets/styles/jqx.fresh.css
https://jqwidgets.com/public/jqwidgets/styles/jqx.metrodark.css

I am having several (probably related) video issues. The bottom portion of the text in the rows are cut off. However, if I have 2 values for rows, for example, manager and employee, when collapsed, the bottom portion of the manager name is cut off. When I expand, both Manager and Employee display fine.
The second issue is that when I move columns from one area to another, the movement leaves a ghost image, meaning that the PivotGrid does NOT entirely erase what was displayed during the movement, and when finished, does NOT refresh the grid. I notice that when I finish the operation, I am getting a javascript error… Uncaught TypeError: Cannot read properly ‘length’ of undefined in jqx-all.js:23

Here is what I see. http://i67.tinypic.com/11j3u6t.png
Display issue

September 7, 2017 at 2:42 pm in reply to: jqxPivotGrid Usage jqxPivotGrid Usage #95878

George S

Participant

Thank you. This is one of those “you never know what you don’t know” situations… so thought I would check.

August 25, 2017 at 2:15 pm in reply to: Removing fractional legend values Removing fractional legend values #95650

George S

Participant

For some graphs, where I have a small range of X values, the grid lines are at 1, 1.5, 2, 2.5, 3, 3.5, etc. Since my data is ONLY integers, I will never have a “x.5” value. Can I set the interval to whole numbers. I tried setting unitInterval:1 but that did not solve it…

Thanks,
George S

July 24, 2016 at 12:52 pm in reply to: AddItem and Group Information AddItem and Group Information #85985

George S

Participant

AddItem did the job. Thanks!

June 20, 2016 at 9:48 am in reply to: AddItem and Group Information AddItem and Group Information #85262

George S

Participant

Use another approach is a valid answer, but regardless, the API doc says that for Listbox.addItem, the GROUP functionality is supported and works. This means that I am either doing something wrong in my code, or the docs are wrong and it is not supported. Is there something wrong with the way I am calling Listbox.addItem?

Thanks

June 10, 2016 at 11:32 am in reply to: Changng Grid Layout Changng Grid Layout #85029

George S

Participant

The FORUM appears to not let me edit a post a second time. This line…
Since the souce is ARRAY, can I tell the grid to now show columns which have no data?

Should read
Since the source is ARRAY, can I tell the grid to NOT show columns which have no data? I can then set columns I don’t wish to show with NULL data for that column.

June 6, 2016 at 1:33 pm in reply to: Bargauge displaying 0 incorrectly Bargauge displaying 0 incorrectly #84932

George S

Participant

So is there a workaround or a fix for this?

June 3, 2016 at 6:06 pm in reply to: toolTipFormatFunction documentation toolTipFormatFunction documentation #84890

George S

Participant

This might help a little… here is some code that I use…

    $('#participation_Left').jqxBarGauge({
                width: 600,
                height: 600,                
            
               // title: {text:myTitle,  subtitle: {text:'Mouse Over to See Categories'}},
                //title: {text:'ABC'},
                        
                //values:[0,0,0,0],
                values:[vQtrField, vYTDField, vQtrTerritory, vYTDTerritory],

                baseValue: 0,
                max: 120,
                barSpacing: 9,
                animationDuration: 0,
                relativeInnerRadius: 0.2,
                startAngle: 0,
                endAngle: 360,
                colorScheme: 'scheme05',
                tooltip: {
                    visible: true,
                    formatFunction: function (value, index)
                    {               
                    if (index ==0) {return '[Current Qtr Field Participation] ' + value + '%'};
                    if (index ==1) {return '[YTD Field Participation] ' + value + '%'};
                    if (index ==2) {return '[Current Qtr Territory] ' + value + '%'};
                    if (index ==3) {return '[YTD Territory] ' + value + '%'};  
                    } }               
            });

June 2, 2016 at 12:36 pm in reply to: jqxBarGauge: error: s is undefined jqxBarGauge: error: s is undefined #84841

George S

Participant

I tried that. I initialize the bargauge fine (and I am seeing this issue with other chart types). But if the bargauge is NOT visible, then I cannot update it. This is only in Firefox. Chrome and Edge do not have this issue. Is there a way (within Firefox) to update a chart when it is NOT visible, so that when it becomes visible, I see the new data. My code works fine IF the chart is visible.

Author

Posts

Viewing 15 posts - 1 through 15 (of 33 total)

1 2 3 →