图表师 url 点击条形图 - javascript

Question

我正在尝试让 onClick 功能与 Chartist 一起使用，使用以下代码打开一个新的 Url（没有 JQuery）：

var chart = new Chartist.Bar('#chart1', {
    labels: [1, 2, 3, 4],
    series: [[5, 2, 8, 3]]
  }, {
  distributeSeries: false
},{
  seriesBarDistance: 20,
  low: 0,
  high: 10
});
chart.on('draw', function(data) {
    if(data.type === 'bar') {
        data.element._node.onclick = func (){window.location = "www.google.com"}


    }
});

但是当我实现这个时，它不会等待点击，它会自动打开 www.google.com。

如何让它等待点击？

有人能澄清我做错了什么吗？

Answer 1

我不知道你的问题，但 func () 不是有效的 javascript 关键字

您应该将其更改为：

data.element._node.onclick = function(){ 
  window.location = "www.google.com"; 
}

Answer 2

试试这个

HTML

   <div id="chartContainer" style="height: 360px; width: 100%;"></div>

JAVASCRIPT

var chart = new CanvasJS.Chart("chartContainer",
{

  data: [
  {
         type: "bar",
         cursor:"pointer",
         click: onClick,          
         dataPoints: [
                 { label: "Google", y: 85, link:"http://google.com/" },
                 { label: "Bing", y: 15, link:"http://bing.com/"},
                 { label: "Yahoo Search", y: 13, link:"http://search.yahoo.com/" },
                 { label: "DuckDuckGo", y: 6, link:"http://www.duckduckgo.com/" },
                 { label: "DogPile", y: 3, link: "http://www.dogpile.com/" }        
           ]
          }
       ]
     });

  chart.render();


function onClick(e){ 
        window.open(e.dataPoint.link,'_blank');  
        };

https://jsfiddle.net/canvasjs/ccxob6bp/

图表师 url 点击条形图 - javascript

Chartist url on click with a bar chart - javascript

javascript

chartist.js

试试这个