Jquery 在SVG rgraph中添加其他列以显示条形图的值
我有一个hbar条,看起来像: 我想在末尾添加额外的列来显示条形图的值。 我想添加两列以在第一行显示数字2和3 我希望我的图表如下所示: 我试图在svg中添加内容,但没有显示 在rgraph for SG中动态添加其他列的正确方法是什么Jquery 在SVG rgraph中添加其他列以显示条形图的值,jquery,svg,rgraph,Jquery,Svg,Rgraph,我有一个hbar条,看起来像: 我想在末尾添加额外的列来显示条形图的值。 我想添加两列以在第一行显示数字2和3 我希望我的图表如下所示: 我试图在svg中添加内容,但没有显示 在rgraph for SG中动态添加其他列的正确方法是什么 FYI 我使用jquery添加了这些列 data=obj.data; $.each(obj.properties.yaxis标签,函数(i,v){ var节点=RGraph.SVG.text.find({ 对象:obj, 正文:v }); RGraph.S
FYI
我使用jquery添加了这些列
data=obj.data;
$.each(obj.properties.yaxis标签,函数(i,v){
var节点=RGraph.SVG.text.find({
对象:obj,
正文:v
});
RGraph.SVG.text({
对象:obj,
父对象:obj.svg,
文本:Math.round(数据[i][0]),
x:+$(节点).attr('x')+obj.graphWidth+8,
y:$(节点).attr('y'),
哈利恩:“左”,
valign:'中心',
//背景:“#FFDE00”,
尺码:12,
//填充:1,
颜色:'黑色',
//颜色:“#999”
});
RGraph.SVG.text({
对象:obj,
父对象:obj.svg,
正文:Math.round(数据[i][1]),
x:+$(节点).attr('x')+obj.graphWidth+23,
y:$(节点).attr('y'),
哈利恩:“左”,
valign:'中心',
//背景:"097054",,
背景网格线:是的,
背景GridBorder:没错,
尺码:12,
颜色:“黑色”
//填充:1,
//颜色:“#999”
});
})
像这样的话:
var hbar = new RGraph.SVG.HBar({
id: 'cc',
data: [[2,3],[1,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0]],
options: {
yaxisLabels: ['Abc','Def','Ghi','Jkl','Mno','Pqr','Stu','Vwx','Yz','nuj'],
xaxis: false,
yaxis: false,
colors: ['yellow','green'],
gutterLeft: 50,
gutterLeftAutosize: false,
gutterRight: 75
}
}).grow();
// Add the text that gives the percentages
for (var i=0; i<hbar.coords.length; ++i) {
var value = hbar.coords[i].element.getAttribute('data-value'),
y = (i % 2 === 0) ? hbar.coords[i].y + hbar.coords[i].height + 5 : y,
x = (i % 2 === 0) ? hbar.width - hbar.properties.gutterRight + 10 : x + 35;
RGraph.SVG.text({
object: hbar,
text: value + '%',
x: x,
y: y,
color: 'black',
halign: 'left',
valign: 'center',
size: 12
});
}
var hbar=new RGraph.SVG.hbar({
id:'抄送',
数据:[[2,3],[1,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],
选项:{
Yaxis标签:['Abc','Def','Ghi','Jkl','Mno','Pqr','Stu','Vwx','Yz','nuj'],
xaxis:错,
亚克西斯:错,
颜色:[“黄色”、“绿色”],
古特左:50,
gutterLeftAutosize:false,
古特莱特:75
}
}).grow();
//添加给出百分比的文本
对于(var i=0;i红色和绿色框只是为了突出显示?还是也要在图表上显示?如果只是需要的文本,可以使用RGraph.SVG.text();函数。有关使用RGaph.SVG.text()的示例函数查看此页的源代码:@Richard its仅高亮显示。但如果可能,我还需要一个网格。我现在检查链接,看看它是否工作。我无法获得/不知道如何获得每行的高度、x位置和y位置,以便我可以将每行的文本放置在最后一列上。我想使附加列显示为其桌子的一部分@Richard@Richard也可以下载生成的SVG图表为PDF格式吗?真是太棒了,伙计..我添加了我尝试过的东西,它太混乱了。这个解决方案非常好而且干净..愉快的编码和更强大的rgraph..如果可能的话,你可以添加一些解释,让我看到并知道我的错误。