How to change width of Tooltip in Infragistics ig grid - infragistics

On the offical docs for Infragistics ig grid, there is nothing mentioned about changing of width.
I have tried:
tooltipShowing: function (evt, args) {
$('#myGrid_tooltips').width(500); // no luck
$('#myGrid_tooltips').addClass('width-500') // still no luck
}

You should set the width over the element with id grid_tooltips. One more thing, all the tooltips has max-width set to equal the width of the column. If you need to show tooltip wider than the column you need to clear max-width. You can do this in tooltipShown event, as tooltipShowing is too early. This code works fine at my side:
tooltipShown: function (evt, args) {
$('#grid_tooltips').css("max-width", "none");
$('#grid_tooltips').width(550);
}

Related

Multi line tooltip with CStatusBar and always activated

I am using the CStatusBar control and here is an example of trying to set the tooltips:
m_StatusBar.CreateEx(this, SBT_TOOLTIPS);
m_StatusBar.SetIndicators(indicators_oclm, paneCount); //We create the status bar
m_StatusBar.SetPaneInfo(paneDate, ID_INDICATOR_DATE, SBPS_NORMAL, 200);
m_StatusBar.SetPaneInfo(paneProgressOrZoomFactor, ID_INDICATOR_ZOOM, SBPS_NORMAL, 200);
m_StatusBar.SetPaneInfo(panePageBreaks, ID_INDICATOR_PAGE_BREAK, SBPS_NORMAL, 200);
m_StatusBar.SetPaneInfo(paneSlipsPerPage, ID_INDICATOR_SLIPS_COUNT, SBPS_NORMAL, 10);
m_StatusBar.SetPaneInfo(paneForeignLanguageGroup, ID_INDICATOR_FOREIGN_LANGUAGE_GROUP, SBPS_NORMAL, 200);
m_StatusBar.GetStatusBarCtrl().SetTipText(paneSlipsPerPage, _T("Line 1\r\nLine2"));
When I display the tooltip:
As you can see, it has not shown two lines:
Line 1
Line 2
I have researched it (example here) but to no avail.
Update
Using slightly different code, sticking with just one line for the tip I now have:
You can see why I prefer multiline. In addition, I really want the pane text to read "Calendar to use" and the tip to have the information. But the tips only show if all the text is not visible. So I also need to make it always activated if possible.
Update
I still can't get multiline but I have come up with a workaround for some of it:
Get the width for "Calendars to Use"
Set the pane width to that value
Update the pane text as "Calendars to Use " (causes the tooltip notification)
Set the tip text
The icon on the cake is getting the multi line support
I tried:
static CToolTipCtrl* pToolTip = NULL;
CToolTipCtrl* ptt = AfxGetModuleState()->m_thread.GetDataNA()->m_pToolTip;
if (ptt != pToolTip) {
// new tooltip
ptt->SetMaxTipWidth(400);
pToolTip = ptt;
}
But the code never gets called.
Update
I have raised this as a feature request with Microsoft.

Showing labels on bubble chart in angular-charts

I am using bubble charts in angular-charts (its based on charts.js)
Users have to hover on bubbles to know their labels
How can I either show labels or turn on tooltips permanently in bubble chart
Premraj
You need to specify it within the options of Chartjs, specifically the callback part. I've given an example of what that looks like. Chart JS Documentation
vm.options = {
"callbacks": {
"label": function (tooltipItem, data) {
return data.datasets[tooltipItem.datasetIndex].label;
}
}

ChartJS: Update tooltip

I'm having a chart build with ChartJS. I'm including datasets.label in multipleTooltipLabel template and facing an update issue. When changing a datasets.label and running chart.update() the tooltip is not updated. I created a JSFiddle demonstrating the issue.
The code I use to include datasets label in tooltip:
var options = {
multiTooltipTemplate: "<%=datasetLabel%>: <%= value + ' %' %>"
};
Beside that option I followed ChartJS usage example for Line charts.
Change label and update chart:
myNewChart.datasets[0].label = 'updated label';
myNewChart.update();
Label shown in tooltip is not updated...
I had a look in ChartJS source code and figured out that showTooltip function is called with a ChartElements array which was not updated.
Update: I might cached the issue. label of dataset is set on each point element and not updated if it changes. showTooltip used this "cached" dataset label when drawing a tooltip. Perhaps this should not be a question on StackOverflow but a bug report for ChartJS.
I found a solution:
myNewChart.datasets[0].points.forEach(function(point) {
point.datasetLabel = 'updated label';
});
This might also be the way it should be done. Chart.js documentation of update method says you should set myLineChart.datasets[0].points[2].value = 50; to change the value. That's confusing cause on creation dataset expects the values in data property. points is generated by Chart.Line Class on init. Naming may be different for other chart types (eg. it's bars for a bar chart).
I'm not quite sure if myLineChart.datasets[0].label value is used somewhere or if could be unchanged.
I could solve your problem by changing the original data object (data.datasets[0].label='updated label') then running myNewChart.initialize(data).
var option = {
plugins: {
tooltip: {
callbacks: {
label: function (context) {
//console.log(context);
label = 'new string ' + context.label + ', ' + context.dataIndex;
return label;
}
}
}
}
};
myChart.options = option;
ToolTips / Points Events are configurable with chartJS options...
Find more here: https://www.chartjs.org/docs/latest/configuration/tooltip.html

How to change the background color of a row in RDLC report on mouse over?

How to change the background color of a row in RDLC report on mouse over?
set background color on mouse over. To identify rows.
$('table:contains("ID"):last tr') is to get the report table. "ID" is used to find out the report table from the form.
JQuery
function ColorRow() {
$('table:contains("ID"):last tr').addClass('trrr');
}
CSS
.trrr:hover {
background-color: orange;
cursor: pointer;
}
Code in ASPX.CS page Report viewer Load Event (call the JQuery Function)
Note: Must add below code, other wise it will not work in all report pages (just in one page). Also repeat table column header in each page.
protected void ReportViewer1_Load(object sender, EventArgs e)
{
ScriptManager.RegisterStartupScript(this, GetType(), "ColorRow", "ColorRow();", true);
}

xcode view collection cell wrong size

I have a custom collection cell nib that has the size w:160 h:146. When i populate my collection view, all the elements are extremely small, like 20px * 20px.
Why does it decrease the size of my cells ? This is my code
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)IndexPath
{
static NSString *CellIdentifier = #"Cell1";
[collectionView registerNib:[UINib nibWithNibName:#"TjansterCell" bundle:nil] forCellWithReuseIdentifier:#"Cell1"];
TjansterCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:IndexPath];
return cell;
}
The issue is that the collection view flow layout is using the default size for its 'itemSize' property. Fortunately, this is easy to fix. Simply add the following code to your collection view's delegate:
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
return CGSizeMake(<your width>, <your height>);
}
I had the same problem where my custom size remained the standard size when I ran the app. Therefore, to solve this problem I found by manually resizing the cell in storyboard first and then entering or re-entered the custom sizes in the size inspector solved this buggy problem.
Also, I found that when you select the collection view in storyboard and select the size inspector. Here you enter the correct dimensions under Collection View Size and enter the dimensions in the Cell size text fields. This is the important part.