javascript - Pie chart click issue - click not detected -

ive been trying create graph display events occuring in different regions of world. went combination of 2 graph 1) d3 google graph (http://bl.ocks.org/mbostock/899711) show regions via map , jquery flot pie charts ( http://people.iola.dk/olau/flot/examples/pie.html) map events. ive stored corresponding lattitiude longitude values in array , markers on map appended on basis of these values. create xhtml:div space on corresponding markers of <foriegnobject> , once these divs created, add pie charts each correspinding div element. graph creation successful, "plotclick" function pie chart, catch click on pie charts. click function not getting detected on pie charts. in pie charts, clicking on slices, calls corresponding click function. same hovering also.

the issue in firefox , im using latest version of firefox 22.0. graph works fine in chrome..

ive added screenshot of graph. known issue or somethng wit method graph created?

  // edit : (code added)   //google map api options  var map = new google.maps.map(d3.select("#mapsss").node(), {     zoom: 2,    pancontrol: true,    pancontroloptions: {        position: google.maps.controlposition.top_right    },    zoomcontrol: false,     maptypecontrol: false,            draggable: false,            scalecontrol: false,            scrollwheel: false,            streetviewcontrol: false,            center: new google.maps.latlng(37.76487, 0),            maptypeid: google.maps.maptypeid.roadmap });    //create overlay. var overlay = new google.maps.overlayview();  // add container when overlay added map. overlay.onadd = function () {     layer = d3.select(this.getpanes().overlaymousetarget)         .append("div")         .attr("class", "stations");      // draw each marker separate svg element.     // use single svg, size have?     overlay.draw = function () {         projection = this.getprojection(),         padding = 10;          //mapdata hasinput details         var marker = layer.selectall("svg")             .data(d3.entries(mapdata))             .each(transform) // update existing markers         .enter().append("svg:svg")             .each(transform)             .attr("class", "marker").attr("id", function (d) {                 return "marker_" + d.key;             });         //creating canvas pie chart         marker.append('foreignobject')             .attr('width', '100%')             .attr('height', '100%').style("background-color", "#000000").append('xhtml:div').attr("class", "piecanvas").attr("id", function (d) {                 return "canvas_" + d.key.split(" ").join("_");             }).style('height', '50px').style('width', '50px');  //creating pie chart on each canvas.. key holds name of each canvas $.plot($("#canvas_" + key.split(" ").join("_")), piechartdata[key], {         series: {             pie: {                 show: true,                 radius: 1,                 innerradius: 0.3,                 tilt: 0.5,                 label: false,                 stroke: {                     color: '#ffffff',                     width: 2.0                 }             },         },         grid: {             hoverable: true,             clickable: true         },         legend: {             show: false         }     }); }    //click function   $(document).on("plotclick", "div.piecanvas", piechartclick); 

i dislike plot. in development had repeatedly incompatibility between browser,the best option found use library, use jplot compatibility multiple browsers better, ie 6.

in oficial forum, there unanswered questions in topic