Javascript 有没有办法在C3.js标签中添加链接?

Javascript 有没有办法在C3.js标签中添加链接?,javascript,c3.js,Javascript,C3.js,我有一个X/Y轴倒置的条形图。以下是我的代码和输出: var myData = {}; myData.x = 'x'; myData.xFormat = "%Y-%m-%d"; myData.type = 'bar'; myX = app.reportsCollection.countedByDay.plotData.X; myY = app.reportsCollection.countedByDay.plotData.Y; myX.sp

我有一个X/Y轴倒置的条形图。以下是我的代码和输出:

    var myData = {};
    myData.x = 'x';
    myData.xFormat = "%Y-%m-%d";
    myData.type = 'bar';
    myX = app.reportsCollection.countedByDay.plotData.X;
    myY = app.reportsCollection.countedByDay.plotData.Y;
    myX.splice(0,0,'x');
    myY.splice(0,0,'Nuevos Reportes');
    myData.columns = [];
    myData.columns.push(myX);
      //http://stackoverflow.com/a/586189/1862909
    myData.columns.push(myY);
    var chart = c3.generate({
      bindto: elementID,
      data: myData,
      size: {
        height: 300
      },
      bar: {
        width: {
            ratio: 0.5 // this makes bar width 50% of length between ticks
        }
        // or
        //width: 100 // this makes bar width 100px
      },
      axis: {
        x: {
          type: 'timeseries',
          tick: {
                  format: "%b-%d"
              }
        },

      },
      legend: {
        show: false
      }
    });

我需要的是链接到X记号标签上的特定页面。在本例中,
Otra
应该是一个超链接

我试图将链接作为文本包含在
myX
变量中,但没有成功


你知道怎么做吗

不是现成的,c3将勾号标签呈现为tspan元素,并使用d3的.text函数添加它们,因此尝试在
中创建模板,以演示如何用其他元素替换c3中的勾号标签。要改变这一点并不难,只需获取现有文本,然后用几个标记将其包装,包括适当的href并将其重新添加为html

事实上,tspans可以直接包含一个标记,所以可以这样做-。最困难的是,它应该是xlink:href而不仅仅是href

重要的一点:

d3.selectAll('.c3-axis-x .tick tspan')
  .each(function(d,i){
    // augment tick contents with link
    var self = d3.select(this);
    var text = self.text();
    self.html("<A xlink:href='"+arrayOfLinks[i]+"'>"+text+"</A>");
});

实际呈现的html是什么样子的?非常好的解决方法,使用d3在呈现元素后更改元素。非常聪明。谢谢。也谢谢另一个答案中的那个人,他的答案只是应用了稍微不同的方法:-)不幸的是,解决方案1在4年后不再有效。C3似乎经常重新生成HTML,因此链接很快又被文本取代。您通常可以管理一次单击,但在那之后,它们都返回到带有纯文本内容的tspans。如果您将其放在c3中的onrendered回调中,它应该会再次拾取
d3.selectAll('.c3-axis-x .tick tspan')
  .on("click", function(d,i){
    window.open(arrayOfLinks[i], "_blank");
});

.c3-axis-x .tick tspan:hover {
  cursor: pointer;
}