Click column in Gantt chart

[sja]

how can i call a function when i click on a column in a Bar chart? and how to know the column selected?

[JuanC]

If you are using jQuery you could use something like this

        $("#myDiv").click(function(evt) {
             if ((evt.hitType == cfx.HitType.Point) || (evt.hitType == cfx.HitType.Between)) {
                 var s = "Series " + evt.series + " Point " + evt.point;
                 if (evt.hitType == cfx.HitType.Between)
                    s += " Between";
                 alert(s);
             }
        });
 

If you are not using jQuery

var divHolder = document.getElementById('myDiv');
chart1.create(divHolder);
divHolder.onclick = doClick;

function doClick(evt)
{
    if (evt.hitType == cfx.HitType.Point)
        alert("Series " + evt.series + " Point " + evt.point);
}

Regards,

JuanC 

HighlightSample.zip

[sja]

i used it but hittype is undefined for evt

[JuanC]

Are you using jQuery? Note that for our data (hitType, series, etc.) to be attached correctly to the event data you need to connect to the click event slightly different whether you are using jQuery or not.

If the problem persists, please try posting a small sample that duplicates your issue, also letting us know the browsers you are using (and jQuery version if using jQuery).

JuanC

[sja]

var countryName = "";

var chart1;

$(document).ready(function ($) {

chart1 = new cfx.Chart();

chart1.setGallery(cfx.Gallery.Gantt);

chart1.getView3D().setEnabled(true);

chart1.getLegendBox().setVisible(false);

var i = 0;

var j = 0;

var data = chart1.getData();

data.setSeries(1);

data.setPoints(3);

var items1 = [{

"type": "Internal",

"number": 5

}, {

"type": "Outgoing",

"number": 7

}, {

"type": "Incoming",

"number": 10

}];

chart1.setDataSource(items1);

chart1.getAllSeries().getBorder().setEffect(cfx.BorderEffect.Raised);

chart1.getAxisX().getGrids().getMajor().setVisible(false);

chart1.getAxisY().getGrids().getMajor().setVisible(false);

chart1.getAxisY().getGrids().getMinor().setVisible(false);

chart1.getAxisX().getGrids().getMinor().setVisible(false);

chart1.getAxisY().setVisible(false);

chart1.getAllSeries().getPointLabels().setVisible(true);

chart1.getView3D().setEnabled(false);

chart1.getAllSeries().setVolume(70);

chart1.getGalleryAttributes().setIntraSeriesGap(60);

chart1.create(document.getElementById('ChartDiv'));

$("#ChartDiv").click(function (evt) {

if ((evt.hitType == cfx.HitType.Point) || (evt.hitType == cfx.HitType.Between)) {

var s = "Series " + evt.series + " Point " + evt.point;

if (evt.hitType == cfx.HitType.Between)

s += " Between";

alert(s);

}

});

});

[JuanC]

Please let us know the browsers you are using and the version of jQuery so that we can try to recreate your environment

JuanC

[sja]

im using IE9 and jquery-1.7.1.min.js

[sja]

any help!!!!! plzzz

[Kiran]

Hi i am not using jquery

when i run the above code i get the error of 

jchartFX.coreVector.js:653 uncaught undefined

Please help