Highcharts conflict with extjs -

-

i trying render 3 highcharts inside extjs tab using prototype adapter. rendering multiple bar charts in single page having click event on bars. charts render below first bar charts not click event have registered them. first chart on page has click event. charts below not click-able though have added click events them. when render same page outside extjs component charts , clicks work fine. guessing there conflict highcharts , extjs.

was able replicate issue in jsfilddle http://jsfiddle.net/knpeg/4/

the following javascript code creating extjs component in same highchart rendered 3 times bottom charts have bars not clickable.

            var centertabpanel = new ext.tabpanel({                        region:'center',                        margins: '0 10 0 0',                        id:'center-panel',                                   activetab:0,                        bodystyle:'padding: 8 5 5 8;',                        autoscroll: true,                items:[  {                                         contentel: 'db_snapshots',                                         title: "charts",                                         autoscroll: true,                                         bodystyle: 'background:#fffff0;padding: 8 5 5 8;'                                     }                         ]                     });                         var viewport = new ext.viewport({                         layout:'border',                                     loadmask : {msg:"testloading..."},                                     monitorresize : true,                         items:[                               centertabpanel                                     ]                     });                             viewport.dolayout();               var chart = new highcharts.chart({                     chart: {                         renderto: "container",                         defaultseriestype: 'column',                         plotbackgroundcolor: null,                         plotborderwidth: null,                         plotshadow: false                      },                         title: {                             text: null                         },                         xaxis: {                             categories: ['first','second','third']                         },                          series: [{                             name:"values",                             data: [133, 156, 947]                         }],                         plotoptions: {                             series: {                                 animation: false,                                 cursor: 'text',                                 point: {                                     events: {                                         click: function() {                                             alert("hello");                                         }                                     }                                 },                                 marker: {                                     linewidth: 1                                 }                             },                             line: {                                 size:'100%',                                 allowpointselect: true,                                 cursor: 'pointer',                                 datalabels: {                                     enabled: false                                 }                             },                             bar: {                                 size:'100%',                                 allowpointselect: true,                                 cursor: 'string',                                 datalabels: {                                     enabled: false                                 }                             }                         }                  });                     var chart2 = new highcharts.chart({                     chart: {                         renderto: "container2",                         defaultseriestype: 'column',                         plotbackgroundcolor: null,                         plotborderwidth: null,                         plotshadow: false                      },                         title: {                             text: null                         },                         xaxis: {                             categories: ['first','second','third']                         },                          series: [{                             name:"values",                             data: [133, 156, 947]                         }],                         plotoptions: {                             series: {                                 animation: false,                                 cursor: 'text',                                 point: {                                     events: {                                         click: function() {                                             alert("hello");                                         }                                     }                                 },                                 marker: {                                     linewidth: 1                                 }                             },                             line: {                                 size:'100%',                                 allowpointselect: true,                                 cursor: 'pointer',                                 datalabels: {                                     enabled: false                                 }                             },                             bar: {                                 size:'100%',                                 allowpointselect: true,                                 cursor: 'string',                                 datalabels: {                                     enabled: false                                 }                             }                         }                  });                  var chart3 = new highcharts.chart({                     chart: {                         renderto: "container3",                         defaultseriestype: 'column',                         plotbackgroundcolor: null,                         plotborderwidth: null,                         plotshadow: false                      },                         title: {                             text: null                         },                         xaxis: {                             categories: ['first','second','third']                         },                          series: [{                             name:"values",                             data: [133, 156, 947]                         }],                         plotoptions: {                             series: {                                 animation: false,                                 cursor: 'text',                                 point: {                                     events: {                                         click: function() {                                             alert("hello");                                         }                                     }                                 },                                 marker: {                                     linewidth: 1                                 }                             },                             line: {                                 size:'100%',                                 allowpointselect: true,                                 cursor: 'pointer',                                 datalabels: {                                     enabled: false                                 }                             },                             bar: {                                 size:'100%',                                 allowpointselect: true,                                 cursor: 'string',                                 datalabels: {                                     enabled: false                                 }                             }                         }                  });

instead of setting point click, can use workaround, , iterate on each series element (in each chart) , add action svg element "on" trigger.

http://jsfiddle.net/knpeg/5/

 (var = 0; < chart3.series[0].data.length; i++) {             chart3.series[0].data[i].graphic.on('click', function () {                 alert('aaa3');             });         }

Comments

Post a Comment

Popular posts from this blog

java - Run spring boot application error: Cannot instantiate interface org.springframework.context.ApplicationListener -

-
i have spring project , try make use spring boot , run @ embadded tomcat following : https://spring.io/guides/gs/rest-service/ this application //@configuration //@enableaspectjautoproxy @springbootapplication @componentscan(basepackages = "gux.prome") public class application { public static void main(string[] args) { springapplication.run(application.class, args); } } if use maven command: mvn spring-boot:run , project starts fine, need debug , run main method @ intelij, exception occurs: exception in thread "main" java.lang.illegalargumentexception: cannot instantiate interface org.springframework.context.applicationlistener : org.springframework.boot.logging.classpathloggingapplicationlistener @ org.springframework.boot.springapplication.createspringfactoriesinstances(springapplication.java:414) @ org.springframework.boot.springapplication.getspringfactoriesinstances(springapplication.java:394) @ org.springframework.bo...
Read more

python - pip wont install .WHL files -

-
when try install .whl gohike typing cmd c:\users\owner\downloads>pip install ta_lib-0.4.9-cp27-none-win_amd64.whl i print out: `processing c:\users\owner\downloads\ta_lib-0.4.9-cp27-none-win_amd64.whl complete output command python setup.py egg_info: traceback <most recent call last>: file "<string>", line 1, in <module> ioerror: [errno 2] no such file or directory:'c:\\users\\owner\\appdata\\lo cal\\temp\\pip-9gwk2c-build\\setup.py' ----------------------------------------- command "python setup.py egg_info" failed error code 1 in c:\users\owner\ap pdata\local\temp\pip-9gwk2c-build\` the part between pip- , -build in pip-9gwk2c-build different on same file. i asked python 2.7.11 pip 8.0.3 can't install gohike whl of ta-lib 0.4.9 few days ago , decided ask differently. can me! you have outdated pip not understand wheels. wheels not supposed have setup.py inside. try upgrading pip pip in...
Read more

Excel VBA "Microsoft Windows Common Controls 6.0 (SP6)" Location Changes -

-
i have excel workbook used generate quotations customers. there main page user inputs data, , there buttons generate various pdfs , send them customer. however, 1 user consistently getting error preventing generating , sending pdfs. i beleive "microsoft windows common controls 6.0 (sp6)". it's installed on users' computers. on mine, location "c:\windows\syswow64\mscomctl.ocx" on others "c:\windows\system32\mscomctl.ocx" the user experiencing issues on 32-bit machine, "mscomctl.ocx" file should in system32. have manually put in there, , pointed common controls reference in vba it. issue seems keep reverting looking in syswow64. since folder doesn't exist, can't find it, , can't produce pdfs. i thought perhaps issue user running older version of office (2007) there users on 2013 , 2016. thought perhaps mixture of 64-bit , 32-bit users. user gets sent workbook other users (as quotation process goes further, gets passed ...
Read more