[英]How to save Legend with a FLOT chart
我正在使用FLOT來創建圖表。 因為我已升級到FLOT javascript庫的0.8.1版本,所以這允許使用畫布保存圖表軸。 我唯一的問題是圖表圖例沒有保存到圖表中。
我需要做些什么才能將圖例傳到畫布上?
這是HTML:
<div class="widget" id="flot_widget" data-collapsed="false" data-collapsible="true" data-icon="buildings" >
<h3 class="handle">Market Data for: <input type="text"
placeholder="Municipality"
id="flotAverageSalePricesCity"
style="float:inherit; font-size: 15px; width:90px;"
required
data-regex="^[a-zA-Z. ]+$" />
<span id="c3"></span>
</h3>
<div class="demo-container" id="demo-container" style="display:none; ">
<div id="placeholder" class="demo-placeholder" ></div>
</div>
</div>
這是javascript:
$("#flotAverageSalePricesCity").result(function(event, data, formatted) {
if (data){
$.ajax({
url: sURL + "utility/ajaxmuniChart1c",
type: "POST",
data: {muni: data[0]},
dataType: 'json',
success: function(json){
if (data) {
myWidth = (document.getElementById('flot_widget').offsetWidth-15)+"px";
myHeight = (document.getElementById('flot_widget').offsetWidth*.66)+"px";
document.getElementById('demo-container').style.display = 'block';
document.getElementById('placeholder').style.width = myWidth;
document.getElementById('placeholder').style.height = myHeight;
var options = {
canvas: true,
series: {
lines: { show: true, fill: false, fillColor: "rgba(255, 255, 255, 0.8)" },
points: { show: true, fill: true }
}
};
if (document.getElementById('c3').childElementCount > 0){
document.getElementById('c3').innerHTML = "";
};
var plotArea = $.plot("#placeholder", [json], options);
var ctx = plotArea.getCanvas();
loc = sURL + 'php/saveme.php';
var cs = new CanvasSaver(loc);
var btnDownload = cs.generateButton('Download', ctx, 'PTS_Chart');
c3.appendChild(btnDownload);
}
}
})
}
})
謝謝您的幫助。
目前這在頁面內是不可能的。 您需要使用像WKHTML2PDF這樣的整頁渲染器。
將圖例渲染到畫布是Flot 0.9的主要項目之一。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.