Сохраните изображение диаграммы, открыв Flash Chart2.

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

Вопрос

Я использую Открыть Flash-диаграмму 2 создать несколько графиков.Я хочу иметь возможность сохранить изображение графика, для которого OFC2 предоставляет некоторые методы.Я использовал пример на сайте OFC2 для прямого отображения необработанных данных изображения на странице, но это не работает в IE6, который использует большинство наших пользователей (знаю, знаю).

Я перешел на метод OFC2, post_image для отправки необработанных данных изображения на сервер.Я использую сценарий Perl для получения данных изображения, сохраняю их в файл и могу просмотреть изображение.Неудачная часть использования post_image Метод заключается в том, что ActionScript выдает ошибку при сохранении изображения:Ошибка № 2101:Строка, передаваемая в URLVariables.decode(), должна быть строкой запроса в кодировке URL, содержащей пары имя/значение.

Это, по-видимому, ошибка в Adobe - см. эта страница.Из-за этой ошибки 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 );
        }
    });

Из некоторых моих закомментированных строк вы можете видеть, что я пробовал различные типы контента и другие настройки вызова 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 не хочет работать во всплывающем окне, созданном с помощью окно.открыть('') на моем 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
}

поэтому, когда мы используем сохранить изображение() Функция (которая называется автоматизированием, когда вы правы Clic Dans выбирают «Сохранить изображение локально» на графике Flahs) Изображение диаграммы передается в всплывающее окно, а данные (Base64 Birary Image) размещаются в сценарии 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