jqplotToImageStr中的标签和图例问题
jqplotToImageStr中的标签和图例问题
提问于 2013-10-28 18:10:50
我正在尝试将一些jqplots传递给服务器并生成pdf。这些情节第一次生成时看上去很好。但是当我使用jqplotToImageStr对它们进行数字化时，它们没有得到适当的缩放，生成的pdf也是如此。所以我的问题是，当我将这些图数字化时，如何设置图的大小/维数。
我过去常用数码
var imgData = [];
imgData.push($('#chart1').jqplotToImageStr({}));数字化前
之后
在添加选项之后
回答 3
Stack Overflow用户
回答已采纳
发布于 2013-10-30 08:30:06
你可以调整你的轴标签的页边距/设置z-索引使用后置.就在$.jqplot之前打电话吧。
$.jqplot.postDrawHooks.push(function () {
$(".jqplot-grid-canvas").css('z-index', '0');
$(".jqplot-series-canvas").css('z-index', '1');
$(".jqplot-overlayCanvas-canvas").css('z-index', '2');
$('.jqplot-yaxis-tick').css('margin-right', '-50px');
$('.jqplot-yaxis-tick').css('z-index', '3');
});jqplotToImageStr将轴标签推到图表后面。所以我用画布按照我需要的顺序重新绘制。当然，您需要对传奇进行更改。对于轴标签，您必须确保使用CanvasAxisLabelRenderer和CanvasAxisTickRenderer以及$.jqplot.config.enablePlugins = true；
下面要导出图像的代码。
function jqplotToImg(obj) {
var newCanvas = document.createElement("canvas");
newCanvas.width = obj.find("canvas.jqplot-base-canvas").width();
newCanvas.height = obj.find("canvas.jqplot-base-canvas").height();
var baseOffset = obj.find("canvas.jqplot-base-canvas").offset();
// make white background for pasting
var context = newCanvas.getContext("2d");
context.fillStyle = "rgba(255,255,255,1)";
context.fillRect(0, 0, newCanvas.width, newCanvas.height);
obj.children().each(function () {
if ($(this)[0].tagName.toLowerCase() == 'canvas') {
// all canvas from the chart
var offset = $(this).offset();
newCanvas.getContext("2d").drawImage(this,
offset.left - baseOffset.left,
offset.top - baseOffset.top
);
} // for the div's with the X and Y axis
});
obj.children().each(function () {
if ($(this)[0].tagName.toLowerCase() == 'div') {
if ($(this).attr('class') == "jqplot-axis jqplot-yaxis") {
$(this).children("canvas").each(function () {
var offset = $(this).offset();
newCanvas.getContext("2d").drawImage(this,
offset.left - baseOffset.left,
offset.top - baseOffset.top
);
});
}
else if ($(this).attr('class') == "jqplot-axis jqplot-xaxis") {
$(this).children("canvas").each(function () {
var offset = $(this).offset();
newCanvas.getContext("2d").drawImage(this,
offset.left - baseOffset.left,
offset.top - baseOffset.top
);
});
}
}
});希望能帮上忙！
Stack Overflow用户
发布于 2013-10-28 19:45:47
以下是您可以指定的选项：
var imgData = [];
var options = {
x_offset : <value>,
y_offset : <value>,
backgroundColor : <value>
};
imgData.push($('#chart1').jqplotToImageStr(options));我认为您可以更改x_offset和y_offset，以获得所需的预期结果。
Stack Overflow用户
发布于 2020-01-23 15:22:27
只是在一些浏览器上遇到了错误的尺寸/缩放.当开发工具打开时，你可以看到最新的铬(铬: 79.0.3945.117)。
您可以验证这里：或检查GitHub问题这里
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19642063
复制相关文章
相似问题
腾讯云开发者
