Блог

У меня простой вопрос — почему мое изображение в формате * .png, созданное PHP GD, неправильно отображается на веб-странице? Мой PHP-код:

back.php

     <?php
    $height = 200;
    $width = 600;
    $jVar = $_POST['jPacket']; //velue from jQuery script

    $im = imagecreatetruecolor($width, $height);
    $white = imagecolorallocate($im, 255, 255, 255);
    $black = imagecolorallocate($im, 0, 0, 0);
    imagefill($im, 0, 0, $white);
//line_1
    imageline($im, 10, 0, 10, $height, $black);
//line_2
    imageline($im, $jVar, ($height/2), $height-$jVar, ($height/2), $black);

    header('Content-type: image/png');
    imagepng($im);
    imagedestroy($im);
?>
  

…и простой jQuery AJAX post здесь:

script.js

 var graphBack = $('<img id="backGraph" src="back.php" alt="backGraph"/>');

$('.value').keyup(function() {
      $.post(
          "back.php", //send the POST here
      {
           jPacket: $('.value').val() //value from <input>
      }, function() {
           $('#backGraph').remove(); //remove old picture
           graphBack.insertAfter($('#sipGraph p')); //put the picture here
      });
  

Изображение отображается правильно, но не все видно. ‘line_1’ виден, потому что все элементы в imageline(...) являются статическими, но ‘line_2’ не отображается, потому 'imageline(..., $jVar, ...) что имеет значение, которое отправляется $_POST['jPacket'] из scipt.js .
Правильно ли я показываю IMG в graphBack.insertAfter($('#sipGraph p')); ?

Когда я выполняю выше scanario, но данные отправляются не из jQuery, а из обычной HTML-ФОРМЫ, все в порядке…

Отправляемое вами сообщение — это не то, что отображается на странице. Когда вы прикрепляетесь var graphBack = $('<img id="backGraph" src="back.php" alt="backGraph"/>'); к странице, вы создаете второй отдельный запрос без post — по сути, загружаете изображение на страницу. Back вызывается по существу дважды, и время с POST не является отображаемым вами ответом.

Вместо этого я бы просто прикрепил сгенерированный тег изображения вдоль строк $('<img id="backGraph" src="back.php?jPacket=' MYAWESOMEJPACKET '" alt="backGraph"/>'); и заменил текущий — дальнейшее обновление скрипта для использования GET .