[milesdParticipant]

Thats is why I asked as the problem still occurs with the latest release and the release history did mention a fix.

Have you been able to recreate and identify the issue?

When will it be fixed?

Thanks

[milesdParticipant]

Did your investigation show anything?

[milesdParticipant]

I have this same issue and I have tracked it down to charts that are in windows no longer show the tooltip. You can see the behavior in your demo example of docking layout dashboard. http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxdockinglayout/index.htm#demos/jqxdockinglayout/javascript-docking-layout-dashboard.htm
In the docked layout the tooltips work on the Project History chart. Now when you undock the chart window the tooltips no longer show and as Scada demonstrated are actual behind. Maybe a Z-index issue.
If you re-dock the window the tooltips work again.

[milesdParticipant]

I have the same issue in a dynamically created chart in a jqxwindow. Just shows the arrow and not the tooltip bubble. Just like the image above. Was this ever resolved?

[milesdParticipant]

Thank you. I mentioned above it was the range column chart I’m trying to do this for. I cant seem to get these times to works with that. The value axis doesn’t seem to have a type property. here is the sample code.

var source =
			 {
				 datatype: "json",
				 datafields: [
				  { name: 'labelName'},
				  { name: 'start_time'},
				  { name: 'end_time'},
				  { name: 'result'},
				  { name: 'percent'},
				  { name: 'bs'},
				  { name: 'count'},
				 ],
				
                          url: 'mcbind2.php
		 	 };		
  //Data being returned from url
			[{"labelName":"15:05:00 - 16:00:00","start_time":"Wed Feb 17 2016 15:05:00","end_time":"Wed Feb 17 2016 16:00:00","count":7,"result":"1309","percent":100,"bs":-1},{"labelName":"15:20:00 - 16:00:00","start_time":"Wed Feb 17 2016 15:20:00","end_time":"Wed Feb 17 2016 16:00:00","count":7,"result":"1041","percent":100,"bs":-1},{"labelName":"15:15:00 - 16:00:00","start_time":"Wed Feb 17 2016 15:15:00","end_time":"Wed Feb 17 2016 16:00:00","count":7,"result":"951","percent":100,"bs":-1},{"labelName":"15:05:00 - 15:55:00","start_time":"Wed Feb 17 2016 15:05:00","end_time":"Wed Feb 17 2016 15:55:00","count":7,"result":"850","percent":100,"bs":-1},{"labelName":"15:10:00 - 15:55:00","start_time":"Wed Feb 17 2016 15:10:00","end_time":"Wed Feb 17 2016 15:55:00","count":7,"result":"706","percent":100,"bs":-1}]

			 var dataAdapter = new $.jqx.dataAdapter(source,
			 {
				autoBind: true,
				async: false,
				downloadComplete: function () { },
				loadComplete: function () { },
				loadError: function () { }
			 });
 

           
            // prepare jqxChart settings
            var settings = {
                title: mkt+' '+ accuracy + ' '+lookback+' '+dis+' '+minutes+' '+tz+' '+show+' '+rank,
                description: "",
                enableAnimations: true,
                showLegend: false,
                padding: { left: 5, top: 5, right: 10, bottom: 5 },
                titlePadding: { left: 90, top: 0, right: 0, bottom: 10 },
                source: dataAdapter,
                xAxis:
                {
                    dataField: 'labelName',
                    tickMarks: {
                        visible: true,
                        interval: 1,
                        color: '#BCBCBC'
                    }
                },
                colorScheme: 'scheme02',
                seriesGroups:
                    [
                        {
                            orientation: 'horizontal',
                            type: 'rangecolumn',
                            columnsGapPercent: 100,
                           
                            valueAxis:
                            {
                            	  type: 'date',
                            	  baseUnit: 'hour',
                                unitInterval: 1,
                            	 
                                flip: true,
                                valuesOnTicks: true,
                         
                                title: { text: 'Day' },
                                tickMarks: { color: '#BCBCBC' }
                            },
                            series: [
                             
                                    
                                    { 
                                    	dataField: 'bs',
                                    	dataFieldFrom: 'start_time', 
                                    	dataFieldTo: 'end_time', 
                                    	displayText: 'hello', 
                                    	opacity: 1,
                                    	toolTipFormatFunction: function (value,itemIndex, serie, group, categoryValue, categoryAxis){
                            						var records = dataAdapter.records;        
                        								var record = records[itemIndex];
                            						return '<DIV>Percent:'+record.percent+'<br>Result='+record.result+'<br>Time='+record.labelName+'</DIV>'
                            	
                            },
                                    	
                                    		colorFunction: function (dataValue, itemIndex, serie, group) {
                                    			if (isNaN(itemIndex))
                                                    return '#55CC55'; 
                                                
                                    		 var records = dataAdapter.records;        
                        								var record = records[itemIndex];
                        								
                                    	  return (record.bs < 0) ? '#CC1133' : '#55CC55';
                                    		
                                      } 
                                    	}
                                 

                                   
                                ]
                           
                        }

                    ]
            };
dataAdapter.dataBind();
            // setup the chart
            $('#chart' + g_index).jqxChart(settings);
            

[milesdParticipant]

Resolved.

apparently

if (isNaN(itemIndex))
      return '#55CC55'; 

this is very important.

[milesdParticipant]

I’m sorry I was looking at the color band example but really its the rangecolumn chart.

I cant seem to get the range column from and to to be based off of time.

Can you show me an example of how to display the range column chart with time?
I have tried:
var data = [
{“name”:”7:30 – 9:20″,”start_time”:”Wed Feb 17 2016 08:05:00 GMT-0800 (Pacific Standard Time)”,”end_time”:”Wed Feb 17 2016 08:50:00 GMT-0800 (Pacific Standard Time)”,”count”:5,”result”:”24″,”percent”:85,”bs”:-1},
{“name”:”6:30 – 9:20″,”start_time”:”Wed Feb 17 2016 09:40:00 GMT-0800 (Pacific Standard Time)”,”end_time”:”Wed Feb 17 2016 09:45:00 GMT-0800 (Pacific Standard Time)”,”count”:4,”result”:”24″,”percent”:85,”bs”:-1},
{“name”:”8:30 – 9:20″,”start_time”:”Wed Feb 17 2016 08:45:00 GMT-0800 (Pacific Standard Time)”,”end_time”:”Wed Feb 17 2016 09:45:00 GMT-0800 (Pacific Standard Time)”,”count”:7,”result”:”28″,”percent”:100,”bs”:-1},
{“name”:”9:30 – 10:30″,”start_time”:”Wed Feb 17 2016 04:45:00 GMT-0800 (Pacific Standard Time)”,”end_time”:”Wed Feb 17 2016 14:35:00 GMT-0800 (Pacific Standard Time)”,”count”:6,”result”:”26″,”percent”:85,”bs”:-1}
];

as well as
var data = [
{“name”:”7:30 – 9:20″,”start_time”:”08:05:00″,”end_time”:”08:50:00″,”count”:5,”result”:”24″,”percent”:85,”bs”:-1},
{“name”:”6:30 – 9:20″,”start_time”:”09:40:00″,”end_time”:”09:45:00″,”count”:4,”result”:”24″,”percent”:85,”bs”:-1},
{“name”:”8:30 – 9:20″,”start_time”:”08:45:00″,”end_time”:”09:45:00″,”count”:7,”result”:”28″,”percent”:100,”bs”:-1},
{“name”:”9:30 – 10:30″,”start_time”:”04:45:00″,”end_time”:”14:35:00″,”count”:6,”result”:”26″,”percent”:85,”bs”:-1}
];

I either get no plot or partial and no time on the axis.

[milesdParticipant]

Thank you I was looking at that example to bind to php but was having problems. I believe that my problem is having the the axis read time. How do you have the color bands chart use time in the axis. as well as set a minimum and maximum time value?

[milesdParticipant]

Thank you.

Is there a way to set knob’s height and width to % and keep the labels. It works fine as a fixed number but not as a percent. As soon as I set as percent the labels disappear.

[milesdParticipant]

Thank you. Yes that does work. However if the knob is on the second tab that is not initially displayed then the label never appears.

[Author]

Posts