[toqueheadParticipant]

From my perspective, I am working on a Web app that has been developed over 10 years with at least tens of programmer years of development, and re-classing every <span> in the application so your chart text works is just not workable. This, IMO, is quite clearly a jqxChart bug.

I can come up with a workaround with a rule like:

div.charting-component-wrapper span { font-size: inherit }

But I am still working around your bug.

[toqueheadParticipant]

It occurs if you define the css rule:

span { font-size: x-small; }

I edited one of your fiddles: http://jsfiddle.net/WnUMv/197/

I observer this on Chrome 44 on Win 7, but not IE 11.

[toqueheadParticipant]

I was using 3.8.0, but tried 3.8.2. No difference.

What else can you suggest?

[toqueheadParticipant]

How do I tell what version I’ve got? We upgraded a couple months back. Isn’t 3.8.2 your latest?

[toqueheadParticipant]

I found an undocumented property “scroll” of jqxValidator that you referenced in another forum post. Like:

$(‘#divPreferences’).jqxValidator({
scroll: false,
rules: [
{ input: ‘#preferences-chart-height’, message: ‘Enter a height between 200 and 4000.’, action: ‘blur’, rule: _validateSize },
{ input: ‘#preferences-chart-width’, message: ‘Enter a width between 200 and 4000.’, action: ‘blur’, rule: _validateSize }
]
});

It solves my problem. Is it safe to use that?

[toqueheadParticipant]

I forgot to mention that padding and titlePadding made no difference to the clipping..

[toqueheadParticipant]

What I’m doing is pretty basic. I have a pie chart, and for each series I supply a toolTipFormatFunction that returns an HTML table. The pie chart renders that <table> inside a span inside a div. There are some padding/margins/borders (I don’t remember which) associated with the containing span and/or div. So if the user clicks on the space associated with the containers, the contextmenu event goes your span/div and not my table, but it is my table that gets decorated with the tooltipClass you recommended.

What I’ve got works and is probably reliable, but you might consider making it easier in future versions.

[toqueheadParticipant]

That mostly works, but if the user clicks on any of the chrome surrounding my custom tooltip, I still miss the event.

My solution is pretty involved for something so simple:

            // Need special handling for r-click on top of chart tooltip
            $(document.body).on('contextmenu', function (event) {
                // We have to look both ways for the table
                var $target = $(event.target);
                var $tooltip = $target.find('table.dashboard-chart-tooltip');
                if (!$tooltip.length)
                    $tooltip = $target.closest('table.dashboard-chart-tooltip');

                if ($tooltip.length) {
                    var tileID = $tooltip.data('tile-id');
                    var $tile = $('#' + tileID);
                    // Call our standard handler, supplying the tile div as this.
                    if ($tile[0]) {
                        onTileContextMenu.call($tile[0], event);
                        event.stopPropagation();
                        return false;
                    }
                }
            });

[toqueheadParticipant]

I managed to answer my own question. The stripped down asmx method is:

public void DownloadContent(string fname, string content)
{
    var response = Context.Response;
    response.Clear();
    response.Charset = "UTF-8";
    response.ContentType = "application/octet-stream";
    response.AppendHeader("Content-Disposition", "attachment; filename=" + fname);
    byte[] bytes = Convert.FromBase64String(content);
    response.OutputStream.Write(bytes, 0, bytes.Length);
    response.Flush();
}

[toqueheadParticipant]

Yes, jqxTabs using Chrome 43 on Win 7.

But as it turns out, I don’t see this behaviour with IE 11.

[toqueheadParticipant]

Thanks.

Can I do it without a dataAdapter?

Firstly, I prefer the simpler solution of direct mapping to my 2D array.

And secondly, in my case, when I use dataAdapter and rangeSelector, dataAdapter goes into an infinite loop (but works fine without the rangeSelector). If I map direct to my data without a dataAdapter, rangeSelector also works fine.

d.

[toqueheadParticipant]

The only solution I came up with involved looking for evidence of a rendered chart (svg, canvas, or div, as the case may be) inside the ‘selected’ handler and not setting the “rendered” flag until such evidence was found. This worked, but didn’t allow me to prepare the charts in the background so they were ready when the user clicked on the tab.

That was only the beginning of my problems though. If the window size changed, any attempt to resize/rerender the charts on non-selected tabs failed. So that means I had to queue up _any_ changes to charts on non-selected tabs and do all that work once the user clicked on the tab. Ugly.

The solution I am going with now involves moving the contents on each tab to an off-viewport div whenever a tab is un-selected, and moving them back when it is selected. In this way, I can simply render and update the charts when I want, and they are ready without delay when the user clicks on a tab. While this container div is out of sight, it obviously can’t be visibility:hidden or display:none or jqxCharts will refuse to render.

This works for me, but is a pain, and the process of finding something that works certainly involved some gnashing of teeth. I do wonder about some your design decisions.

[toqueheadParticipant]

Thanks for your response.

Neither of those solutions work. When a tab is added via jqxTabs(‘addAt’, …), it immediately becomes selected. The problem is because I am adding multiple tabs at once during page load, only one can be selected when the service calls return and I actually initialize the charts.

1. The flag technique fails because the tab was first selected immediately after being added, so the flag will be set then. If the flag is not set until the data actually arrives and the chart is rendered, then it will be set but the chart will not be rendered because by now the tabs (except for one) will be hidden.

2. Your second suggestion doesn’t make sense because a tab is already automatically selected when it is dynamically added.

d.

[Author]

Posts