使用打開的flash圖表保存圖表圖像

我正在使用Open Flash Chart 2創建一些圖表。我希望能夠保存圖形的圖像，OFC2提供了一些方法來實現這一點。我使用OFC2網站上的示例直接在頁面上顯示原始圖像數據，但這在IE6中不起作用，我們大多數用戶正在使用（我知道，我知道）。使用打開的flash圖表保存圖表圖像

我切換到使用OFC2方法，post_image將原始圖像數據發佈到服務器。我使用Perl腳本來接收圖像數據，將其保存到文件中，然後我可以查看圖像。關於使用post_image方法的不幸部分是，在保存圖像時，ActionScript會引發錯誤：錯誤＃2101：傳遞給URLVariables.decode（）的字符串必須是包含名稱/值對的URL編碼查詢字符串。

這顯然是Adobe中的一個錯誤 - 請參閱this page。由於這個錯誤，post_image方法沒有成功完成，所以JavaScript回調不會觸發 - 我基本上沒有辦法確定圖像是否已成功保存。所以，我想我會使用OFC2的get_img_binary方法來獲取圖像的二進制數據，並使用jQuery將二進制數據發佈到我的Perl腳本中。

我找不出如何正確發送二進制數據，或者如何讓我的Perl腳本正確接收二進制數據，或者兩者兼而有之。

這裏是我的jQuery函數：

var chartObj = $("#chart_object").get(0); 
    $.ajax({ 
     type: "POST", 
     url: 'download_image.pl', 
     //contentType: 'application/octet-stream', 
     contentType: 'image/png', 
     //processData: false, 
     //data: { imgData: chartObj.get_img_binary() }, 
     data: chartObj.get_img_binary(), 
     dataType: "text", 
     success: function(data) { 
      console.log(data); 
     } 
    });

您可以從一些我曾嘗試過各種CONTENTTYPES和Ajax調用的其他設置我註釋掉線看。

Ajax調用正在發送一些數據，但它看起來不是二進制的。我認爲這是二進制數據的base64表示。

有沒有人有任何想法如何將二進制數據從JavaScript發送到服務器？

Perl腳本我對post_image方法工作正常，所以我不認爲問題在那裏？

在此先感謝！

來源

2009-12-03 BrianH

我似乎偶然發現了這個解決方案。

這裏是我的Ajax調用：

var chartObj = $("#chart_object").get(0); 
$.ajax({ 
    type: "POST", 
    url: 'download_image.pl', 
    contentType: 'application/octet-stream', 
    processData: false, 
    data: imgData, 
    dataType: "text", 
    success: function(data) { 
     console.log(data); 
    } 
});

，這裏是我的Perl代碼段過程/保存圖像：

use CGI qw(:standard); 
use MIME::Base64; 

... 
my $img64 = param('POSTDATA'); 
my $img = decode_base64($img64); 
... 
#then print $img out to a file in binary mode

我不得不PNG文件的Base64表示解碼，並然後將其保存到文件中。

來源

2009-12-03 17:32:53 BrianH

我已經得到了太多的麻煩，使用IE6和OFC2保存圖像...所以這裏的腳本我使用（JavaScript的+ PHP）

我知道這是不是很美麗，但jQuery的不希望在彈出窗口創建通過window.open（''）在我的IE6，所以我決定使用「老派方法」來獲取它...

// javascript in the page displaying the flash chart 
OFC = {}; 
OFC.jquery = { 
    name: "jQuery", 
    image: function(src) { return '<img src="data:image/png;base64,' + $('#'+src)[0].get_img_binary() + '" \/>'}, 
    popup: function(src) { 
    var img_tag = OFC.jquery.image(src); 
    var img_win = window.open('', 'imagesave'); 
    img_win.document.write('<html><head><title>imagesave<\/title><\/head><body>'+ img_tag + '<\/body><\/html>'); 
    img_win.document.close(); 
    }, 
    popupie: function(src) { 
    var img_data = "image/png;base64,"+$("#"+src)[0].get_img_binary(); 
    var img_win = window.open('', 'imagesave'); 
    with(img_win.document) { 
     write('<html>'); 
     write('<head>'); 
     write('<title>imagesave<\/title>'); 
     write('<\/head>'); 
     write('<body onload="document.forms[0].submit()">'); 
     write('<form action="\/ofc\/base64post.php" method="post">'); 
     write('<input type="hidden" name="d" id="data" value="'+img_data+'" \/>'); 
     write('<\/form>');  
     write('<div><img src="\/ofc\/ajax-loader.gif" border="0" alt="" \/><\/div>'); 
     write('<div style="font-family: Verdana;">Please wait<br \/>After you can save the image<\/div>'); 
     write('<\/body>'); 
     write('<\/html>'); 
    } 
    img_win.document.close(); 
    } 
} 

function save_image() { // this function is automatically called 
    if ($.browser.msie) 
    OFC.jquery.popupie("my_chart"); // only for IE navigators 
    else 
    OFC.jquery.popup("my_chart"); // for the others 
}

所以，當我們使用save_image（）函數（當你右鍵CLIC丹斯選擇FLAHS圖表上的「保存圖像本地」是automaticaly稱呼）圖表的圖像tranfered到彈出和數據（二進制的base64圖像）發佈到PHP腳本/ofc/base64post.php該rander圖片：

<?php 
// base64post.php 
$data = split(';', $_POST['d']); 
$type = $data[0]; 
$data64 = split(',', $data[1]); 
$pic = base64_decode($data64[1]); 
header("Content-type: $type"); 
echo $pic; 
?>

希望能幫助別人！

來源

2010-02-23 08:48:43 sly63

而不是打開另一個窗口中的圖像，我想有一個保存對話框，將圖像保存爲jpg/png。可能嗎？ – mansoondreamz 2014-09-23 07:01:12

使用打開的flash圖表保存圖表圖像

回答

相關問題