如何解决单击它时获取 XAxisLabel 值
嗨,我在 angular 7 应用程序中使用 rgraph。 一切都按预期工作。但我需要如下功能。
我想在点击它时获取 xaxislabel 的值。 如果有人有答案,请告诉我。
提前致谢
我在下面尝试过但没有用
document.getElementsByClassName('rgraph_accessible_text_xaxis_labels')[0].addEventListener('click',function(){
alert('text'+ document.getElementsByClassName('rgraph_accessible_text_xaxis_labels')[0].nodeValue);
});
解决方法
你已经很接近了 - 我已经做了一些改动的演示:
<!DOCTYPE html>
<html>
<head>
<script src="https://www.rgraph.net/libraries/RGraph.common.core.js"></script>
<script src="https://www.rgraph.net/libraries/RGraph.bar.js"></script>
</head>
<body>
<h1>Clickable labels</h1>
<canvas id="cvs1" width="600" height="250">[No canvas support]</canvas>
<script>
new RGraph.Bar({
id:'cvs1',data: '8,4,6,3,5,2'.split(','),options: {
xaxisLabels: ['Mon','Tue','Wed','Thu','Fri','Sat','Sun'],textAccessiblePointerevents: true
}
}).draw();
label = document.getElementsByClassName('rgraph_accessible_text_xaxis_labels')[0];
// Add a mousemove listener that changes the mouse cursor to the hand
label.addEventListener('mousemove',function(e)
{
e.target.style.cursor = 'pointer';
},false);
// Add a click listener that shows an alert
label.addEventListener('click',function(e)
{
alert('Text: '+ label.innerHTML);
},false);
</script>
</body>
</html>
这里有一个代码笔来演示它:
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。