We Keep Coding

Highchart - Sankey click event for node

i tried to add click event to sankey diagram node.
I found link click event is possible, but not node click event.
is it possible to add click event to node?

In this example you can see how there is a click on point event added to the chart plotOptions, this is one way to add a click to a point.
https://api.highcharts.com/highcharts/series.sankey.point.events
plotOptions: {
series: {
point: {
events: {
click: function() {
let point = this;
console.log('click point', point, 'from', point.from, 'to', point.to);
}
},
}
}
},
Another way is a click on point linked using its id.
https://api.highcharts.com/highcharts/series.sankey.nodes
nodes: [{
id: 'Brazil',
}, {
id: 'Portugal',
events: {
click() {
let series = this.series,
nodes = series.nodeLookup;
console.log('click event on node linked by id ', nodes);
}
}
}],
Demo: https://jsfiddle.net/BlackLabel/jw8skp1z/

Highcharts custom buttons with tooltips

actually I work with highcharts and I would like to ask if I can add some tooltip to the custom buttons of highcharts.
Therefore I added to my chart the following code:
exporting: {
buttons: {
customButton: {
x: -62,
onclick: function () {
$("[data-toggle='tooltip']").tooltip();
},
symbol: 'circle'
}
}
},
But unfortunately the onclick function doesn't trigger a tooltip.
I would be very happy, if you can help me.
Thank you in advance.
Greets

$("button").click(function(){
$("selector").attr("alt","tooltipvalue");
});

Sencha Touch - Calling function within view does not get called

Ive just started to explore sencha. Stuck up with this. Help Appreciated :)
This is my java script code, in the below line handler function i am calling the following the method, which in under items and parent xtype form-panel.
{
xtype:'panel',
defaults:{
xtype:'button',
style:'margin: 0.1em',
flex:1
},
layout:{
type:'hbox',
align:'center'
},
items:[
{
text:'Submit',
handler:this.makeReq,
scope:this
},
{
text:'Terms & Conditions',
}
]
}
This is the method that am calling in the above function, but it seems does not happen anyting.
makeReq: function() {
alert("Hey There");
}

I really suggest you follow the Sencha Touch 2 MVC model in this case. You can give your button an action like this:
{
text:'Submit',
action: 'submit'
}
Then you can refer this button and set the function for it inside your app's controller:
config: {
refs: {
submitButton: 'button[action=submit]',
},
control: {
submitButton: {
tap: 'makeReq'
},
},
makeReq: function() {
alert("Hey There");
}
}

ExtJS and this.control query

I have an issue with the next code block:
run: function(e, row){
var me = this;
var container = Ext.getCmp('centercontainer');
try {
container.removeAll();
} catch(e) { }
// This block is called from another file, I just put it here to show you.
me.panels = [{
xtype: 'tabpanel',
id: 'containertabpanel',
items: [{
itemId: 'package',
title: me.PackageTitle
},{
itemId: 'excursion',
title: me.ExcursionTitle
}]
}];
// Reset
container.setTitle(me.EditDestinationTitle + row.data.name);
container.add(me.panels);
me.tabs = container.getComponent('containertabpanel');
// console.log(Ext.ComponentQuery.query('#containertabpanel > #package'))
me.control({
// Work with
// 'tab': {
// Doesn't work
'containertabpanel > package': {
mouseover: me.doPackage
}
})
},
Anyone knows how do I get to catch the click event of "package" item of tabpanel component?
I saw when I use just "tab" selector on this.control query, that work, but I can't get only "package" tab component.
Thank you in advance.

In your definition of your tabpanel you can specify -
listeners:{
click:{
fn: function(){
//click handling code goes here
}
}
}

If I understood correctly this is controller code and you are trying to catch an item click on the panel which is one of many in a tabpanel
What you can do is identify your panel by any property that is unique to it via the component query syntax like this: button[myprop=blah]
This syntax will match any buttons on the page with the following config:
{
xtype:'button'
myprop:'blah'
}
In your case you can try tab[itemId=package]
What you also need to be careful about is controller can listening only for events that are fired by the components. Make sure the event you are listening for is fired (check the docs). You can always fire custom events if necessary.

You need to do this
me.control({
// Work with
// 'tab': {
// Doesn't work
'containertabpanel > #package': {
mouseover: me.doPackage
}
})

Calling functions with click handlers in ExtJS 4

I have a function inside a toolbar, let's call it:
Ext.define('MyArchive.Toolbar', {
search: function() {
console.log('searching');
}
}
Now I'd like to call this function when clicking a button. So I'm adding some click handlers in the afterRender on the toolbar setup:
afterRender: function() {
Ext.getCmp('search-button').on('click', this.search);
}
However, this doesn't work and I ultimately need to go the full route of:
afterRender: function() {
Ext.getCmp('search-button').on('click', function() {
quick_search();
)};
}
Any particular reason why my first attempt doesn't apply the click handler as I expect?
Thanks for any explanations or refactorings! Additional patterns/idioms welcome...

Next try:
var panelOverall = new Ext.form.FormPanel({
html: 'bla',
search: function() {
console.log('searching');
},
buttons: [
{
text: 'Moo',
id: 'button1',
handler: function(){
//window.destroy();
}
}
],
afterRender: function() {
Ext.getCmp('button1').on('click', this.search);
}
});
is working for me.. am I missing something?