Javascript 将矩形添加到highchart
我试图在一个图表中的一组y&x坐标之间添加一个方框Html或其他内容。基本上是一个介于x20和y25之间的盒子,但无法找到数字来计算盒子的正确宽度和高度,也无法设置放置盒子的正确x、y坐标。尝试渲染一个矩形和一个标签,如fiddle示例所示,但没有得到它 解决方案是使用chart.x/yAxis[0].toPixelsvalue。将从图表上的值转换为像素位置: 我只渲染rect,因为标签可以有一些额外的填充,这会弄乱rect。现在,使用chart.renderer.text方法以相同的方式添加文本 注: SVG中的点0,0是视口的左上角。解决方案是使用chart.x/yAxis[0].toPixelsvalue。将从图表上的值转换为像素位置: 我只渲染rect,因为标签可以有一些额外的填充,这会弄乱rect。现在,使用chart.renderer.text方法以相同的方式添加文本 注: SVG中的点0,0是视口的左上角Javascript 将矩形添加到highchart,javascript,highcharts,Javascript,Highcharts,我试图在一个图表中的一组y&x坐标之间添加一个方框Html或其他内容。基本上是一个介于x20和y25之间的盒子,但无法找到数字来计算盒子的正确宽度和高度,也无法设置放置盒子的正确x、y坐标。尝试渲染一个矩形和一个标签,如fiddle示例所示,但没有得到它 解决方案是使用chart.x/yAxis[0].toPixelsvalue。将从图表上的值转换为像素位置: 我只渲染rect,因为标签可以有一些额外的填充,这会弄乱rect。现在,使用chart.renderer.text方法以相同的方式添加文
var chart = new Highcharts.Chart(options);
chart.renderer.label('1,99 %', chart.xAxis[0].left,265)
.attr({
r: 0,
width: 97,
height: 66,
fill: 'blue'
})
.css({
color: 'white',
fontWeight: 'bold'
})
.add();
});
var chart = new Highcharts.Chart(options);
var x1 = chart.xAxis[0].toPixels(0),
x2 = chart.xAxis[0].toPixels(20),
y1 = chart.yAxis[0].toPixels(0),
y2 = chart.yAxis[0].toPixels(25);
chart.renderer.rect(x1, y2, x2 - x1, y1 - y2)
.attr({
fill: 'blue'
}).add();