How to show/hide google chart's tooltip programatically? - google-visualization

Is there any way to show/hide (open/close) google chart tooltip programatically? My tooltip is html enabled, trigger by 'selection'. I am trying to add a close icon to the tooltip.

You can show it using setSelection() method, for example:
var options = {
....
tooltip: { trigger: 'selection' }
...
}
chart.setSelection([{row:0, column:1}]);
See example at jsbin.
And hide it using empty object:
chart.setSelection([{}]);
See example at jsbin.

Related

Oracle APEX hide the x on the modal dialog

I tried to hide the x on the upper right-hand corner of my modal dialog window using both css and JQuery but nothing owrks. I tries using dynamic action on page load:
$("button.ui-button.ui-corner-all.ui-widget.ui-button-icon-only.ui-dialog-titlebar-close").hide();
and to use css:
button.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-icon-only.ui-dialog-titlebar-close
{
visibility: hidden !important;
}
for my inline css but neither worked, the x still shows up
The div where this button is showed is rendered in the parent page, so to get it in the modal page, you need to add "parent" in the beginning of your javarscript.
try this:
var button = parent.$('.ui-dialog-titlebar-close'); //get the button
button.hide(); //hide the button

ember-cli-pagination - how to scroll to top of page on page change?

I've got the {{page-numbers}} at the bottom of the page. When I click a page number, the page loads fine, but I'm still at the bottom of the page.
How can I get it to scroll to the top when changing pages?
Is there a better addon to use for this?
I was able to accomplish this by overriding the page-numbers component:
import PageNumberComponent from 'ember-cli-pagination/components/page-numbers';
export default PageNumberComponent.extend({
actions: {
pageClicked: function(number) {
this._super(...arguments);
window.scrollTo(0, 0);
}
}
});

How to change font color in semantic UI React Accordion

I'm currently trying to use the accordion component of Semantic UI React and can't figure out how to change the color and arrow to white.
https://semantic-ui.com/modules/accordion.html
In the css, you can see that the widget has styling that configures it to black.
Does the component have a way to change the text color?
Is it possible to put a parent div to override the color text? (tried
that but didn't work)
How would you override the color? Any workaround. (This can be done with an override as mentioned below in the comments with the !important tag)
The accordion react component takes in panels
const panels = [
{
title: "test1",
content: "test1"
},
{
title: "test2",
content: "test2"
},
{
title: "super",
content: "test"
}
]
<Accordion className="test" panels={panels}/>
.test{
color:white;
}
The accordion takes in a className, but passing in a style doesn't seem to work at all either. I've tried at each level as well Accordion.Title Tag.
You have to personalized the class of the composant you want to change and you have to "overriding" the css classes of semantic-ui using !important.
.ui.accordion.perso
.title:not(.ui) {
color : #ffffff !important;
}
If you want more info on !important (https://css-tricks.com/when-using-important-is-the-right-choice/)
Peace
Figured it out.
<Accordion>
<Accordion.Title className="test2">
<Icon name='dropdown' />
<label className="label-color"> super</label>
</Accordion.Title>
<Accordion.Content>
</Accordion.Content>
</Accordion>
Realized that I could just use the separate components of an accordion and add my own elements and style it.

Foundation Tab change event

I am doing validation through validation plugin on a page in which tabs getting created through foundation top bar. I want the error messages to be hidden when tab changes.Is there any work around for this??
in foundation 6:
$(selector).on('change.zf.tabs', function() {
//do something
});

UITabBar item did select is not working

i have two tab bar items with two different table view with navigation controllers.
by clicking on the tab1--- table1 is opening...Good. but when i did select on table1 it goes to the another view (table did select view)....every thing is good.
but the problem here is
when i am clicking on tab2 ----table 2 is opening....Good.
But again clicking on tab1------ it is not loading the table1....it is loading (table did select view) view. As the last time i left it there.
i want to open table1----on clicking on tab1......by programming.
help me
That is the expected behaviour if you are using the tab bar controller and the navigation controller in the item of the tab bar. User will expect the tab to retain the state of the view.
If you still want to enforce the app to go back to the root view controller of the navigation controller when user goes back to the tab, you can implement the UITabBarControllerDelegate tabBarController:didSelectViewController: method. What this delegate method does is:
Tells the delegate that the user selected an item in the tab bar.
Then call the method of UINavigationController called popToRootViewControllerAnimated: when user tap on the tab. This will help you to:
Pops all the view controllers on the stack except the root view
controller and updates the display.
For example:
- (void)tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController
{
if(viewController == yourNavigationController) {
UINavigationController *navigationController = (UINavigationController *)viewController;
[navigationController popToRootViewControllerAnimated:NO];
}
}