imagem do gráfico Salvar com Chart2 de flash aberto

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

Pergunta

Eu estou usando Open Flash Chart 2 para criar alguns gráficos. Eu quero ser capaz de salvar uma imagem do gráfico, que OFC2 fornece alguns métodos para alcançar este objetivo. Eu usei o exemplo no site OFC2 para diretamente exibir os dados de imagem não processados ??na página, mas isso não funciona no IE6, que a maioria dos nossos usuários estão usando (eu sei, eu sei).

I passou a usar o OFC2 método, post_image para postar os dados de imagem raw para o servidor. Eu uso um script Perl para receber os dados de imagem, salve-o em um arquivo, e eu posso ver a imagem. A parte triste sobre como usar o método post_image é que ActionScript lança um erro ao salvar a imagem: Erro # 2101:. A String passada para URLVariables.decode () deve ser uma string codificada como URL contendo pares nome / valor

O que aparentemente é um erro no Adobe - veja desta página . Devido a esse erro, o método post_image não for concluída com êxito, de modo que o callback javascript nunca vai fogo - eu basicamente não tem uma maneira de dizer se a imagem foi salva com sucesso

.

Então, eu pensei que eu iria usar o método get_img_binary de OFC2 para obter os dados binários da imagem, e usar jQuery para postar os dados binários para o meu script Perl.

Eu não consigo descobrir como enviar os dados binários corretamente, ou como deixar o meu script Perl receber os dados binários corretamente, ou ambos.

Aqui é a minha função 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 );
        }
    });

Você pode ver alguns dos meus comentadas linhas que eu tentei várias ContentTypes e outras configurações da chamada Ajax.

A chamada Ajax é o envio de alguns dados, mas não parecem ser binário. Eu acho que é uma representação Base64 dos dados binário.

Alguém tem alguma idéia sobre como enviar dados binários de javascript para o servidor?

O script Perl que eu tenho funciona bem para o método post_image, então eu não acho que o problema é que há?

Agradecemos antecipadamente!

Foi útil?

Solução

Eu pareço ter tropeçado na solução.

Aqui está minha chamada 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 );
    }
});

E aqui está a minha Perl trecho de processo / salvar a imagem: 

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

Eu tinha que decodificar a representação base64 do arquivo PNG, e depois salvá-lo em um arquivo.

Outras dicas

Eu tenho problemas demais com o uso IE6 e OFC2 para salvar a imagem ... Então, aqui estão os scripts que eu uso (javascript + PHP)

Eu sei que não é muito bonita, mas jQuery não querem trabalhar em um pop-up criado através de window.open ( '') no meu IE6, então eu decidi usar um "método old school" para obtê-lo ... 

// 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
}

Assim, quando usamos o save_image () função (que é automaticamente chamado quando você direito, selecione dans clic "Salvar imagem localmente" no gráfico flahs) a imagem do gráfico é tranfered para o pop-up e os dados (base64 imagem binária) são enviados para um script php /ofc/base64post.php que rander a imagem : 

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

esperança que ajuda alguém!

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top