NVD3 LinePlusBarChart.enableFocus on单击不工作

NVD3 LinePlusBarChart .enableFocus onClick no working

本文关键字:工作 单击 on LinePlusBarChart enableFocus NVD3      更新时间:2023-09-26

我正试图以这个例子为指导,用NVD3库切换焦点图。代码可以在这里找到。

这是我用来切换的按钮:

<div>
  <button onclick="chart_users_new.focusEnable(!chart_users_new.focusEnable()); chart_users_new.update();">toggle focus</button>
</div>

这是我的图表代码:

var chart_users_new
nv.addGraph(function() {
  chart_users_new = nv.models.linePlusBarChart()
    .margin({top: 30, right: 80, bottom: 50, left: 80})
    .color(d3.scale.category10().range())
    .tooltipContent(function(key, x, y, e, graph) {
       //irrelevant 
    });;
  // FULL Graph
  chart_users_new.xAxis.tickFormat(function(d) {
    return d ? d3.time.format('%H:%M%')(new Date(d)) : '';
  });
  chart_users_new.xAxis.axisLabel('Label');
  chart_users_new.y2Axis
    .axisLabel('Label')
    .tickFormat(d3.format(',.'));
  chart_users_new.y1Axis
    .axisLabel('Content at time (true or false)')
    .tickFormat(d3.format(',f'));
  chart_users_new.bars.forceY([0]);
  chart_users_new.lines.forceY([0]);
  d3.select('#chart_users_new2 svg')
      .datum(new_chart_concurrent_users_data)
      .transition()
      .duration(0)
      .call(chart_users_new)
      .selectAll('rect.nv-bar').style("fill-opacity", function(d, i){
        return d.has_content == true ? 0.8:0.5;
      });

  nv.utils.windowResize(chart_users_new.update);
  return chart_users_new;
});

当我点击按钮时,这是Chrome中打印到控制台的错误:

Uncaught TypeError: chart_users_new.focusEnable is not a function

非常感谢您的帮助,谢谢。

您需要包含与链接到的示例中相同的库才能获得此功能。