フラッシュチャート2を開いた状態でチャート画像を保存

StackOverflow https://stackoverflow.com/questions/1841001

質問

使っています フラッシュ チャート 2 を開く いくつかのグラフを作成します。グラフの画像を保存できるようにしたいのですが、OFC2 はこれを実現するためのメソッドをいくつか提供しています。OFC2 サイトの例を使用して、生の画像データをページに直接表示しましたが、ほとんどのユーザーが使用している IE6 では機能しません (わかっています、わかっています)。

OFC2方式の使用に切り替えました。 post_image 生の画像データをサーバーに投稿します。Perl スクリプトを使用して画像データを受信し、ファイルに保存すると、画像を表示できます。使用上の残念な点は、 post_image この方法では、画像を保存するときに ActionScript がエラーをスローします。エラー #2101:URLVariables.decode() に渡される文字列は、名前と値のペアを含む URL エンコードされたクエリ文字列である必要があります。

これは明らかに Adob​​e のバグです - を参照してください。 このページ. 。このエラーのため、 post_image メソッドが正常に完了しないため、JavaScript コールバックは起動しません。基本的に、画像が正常に保存されたかどうかを確認する方法がありません。

そこで、使ってみようと思ったのが、 get_img_binary OFC2 のメソッドを使用して画像のバイナリ データを取得し、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 );
        }
    });

コメントアウトした行の一部から、さまざまな contentType や Ajax 呼び出しのその他の設定を試したことがわかります。

Ajax 呼び出しはデータを送信していますが、バイナリではないようです。バイナリデータのbase64表現だと思います。

JavaScriptからサーバーにバイナリデータを送信する方法について何かアイデアを持っている人はいますか?

私が持っている Perl スクリプトは、 post_image 方法なので、問題はないと思いますか？

前もって感謝します！

役に立ちましたか？

解決

私は解決策につまずいているように見える。

ここに私の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で表現をデコードして、ファイルに保存する必要がありました。

他のヒント

私も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
}

したがって、を使用するときは、 画像を保存（） function（clic dansがFlahsチャートで「画像をローカルに保存」を選択するときに呼び出される自動化されます）チャートの画像はポップアップに移動され、データ（base64バイナリ画像）がPHPスクリプトに投稿されます /ofc/base64post.php 画像を表示します:

<?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;
?>

誰かを助けることを願っています！

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top