Использование PhantomJs с петлями PHP

Question

Я работаю над интеграцией PhantomJS, чтобы помочь создать изображения на моем сервере, которые затем могут быть использованы в шаблоне HTML и сохранены в PDF с использованием mPDF. Я использую Yii2 и сумел создать и сохранить изображение, используя некоторые фиктивные сценарии. Но я не уверен, как это сделать в массовом порядке для динамических данных.

В настоящее время у меня есть это очень сырая реализация:

shell.php

if(exec('C:\xampp\htdocs\phantomjs\bin\phantomjs C:\xampp\htdocs\ reporting\views\site\test.php')){ 
echo 'yes'; 
} else echo 'no'; 

Моего test.php файл в основном файл JavaScript только с расширением PHP.

test.php

var system = require('system'); 
var page = require('webpage').create(); 
var fs = require('fs'); 

// load JS libraries 
if(page.injectJs('C:\\xampp\\htdocs\\phantomjs\\jquery.1.9.1.min.js')){ 
console.log('Jquery used'); 
} 
if(page.injectJs('C:\\xampp\\htdocs\\phantomjs\\highcharts.js')){ 
console.log('highcharts used'); 
} 
if(page.injectJs('C:\\xampp\\htdocs\\phantomjs\\highcharts-convert.js')){ 
console.log('highcharts-convert used'); 
} 

var args = { 
width: 600, 
height: 500 
}; 

var svg = page.evaluate(function(opt){ 
$('body').prepend('<div id="container"></div>'); 

var chart = new Highcharts.Chart({ 
    chart: { 
     renderTo: 'container', 
     width: opt.width, 
     height: opt.height 
    }, 
    exporting: { 
     enabled: false 
    }, 
    title: { 
     text: 'Combination chart' 
    }, 
    xAxis: { 
     categories: ['Apples', 'Oranges', 'Pears', 'Bananas', 'Plums'] 
    }, 
    yAxis: { 
     title: { 
      text: 'Y-values' 
     } 
    }, 
    labels: { 
     items: [{ 
      html: 'Total fruit consumption', 
      style: { 
       left: '40px', 
       top: '8px', 
       color: 'black' 
      } 
     }] 
    }, 
    plotOptions: { 
     line: { 
      dataLabels: { 
       enabled: true 
      }, 
      enableMouseTracking: false 
     }, 
     series: { 
      enableMouseTracking: false, 
      shadow: false, 
      animation: false 
     } 
    }, 
    series: [{ 
     type: 'column', 
     name: 'Andrii', 
     data: [3, 2, 1, 3, 4] 
    }, { 
     type: 'column', 
     name: 'Fabian', 
     data: [2, 3, 5, 7, 6] 
    }, { 
     type: 'column', 
     name: 'Joan', 
     data: [4, 3, 3, 9, 0] 
    }, { 
     type: 'spline', 
     name: 'Average', 
     data: [3, 2.67, 3, 6.33, 3.33], 
     marker: { 
      lineWidth: 2, 
      lineColor: 'white' 
     } 
    }, { 
     type: 'pie', 
     name: 'Total consumption', 
     data: [{ 
      name: 'Andrii', 
      y: 13, 
      color: '#4572A7' 
     }, { 
      name: 'Fabian', 
      y: 23, 
      color: '#AA4643' 
     }, { 
      name: 'Joan', 
      y: 19, 
      color: '#89A54E' 
     }], 
     center: [100, 80], 
     size: 100, 
     showInLegend: false, 
     dataLabels: { 
      enabled: false 
     } 
    }] 
}); 

return chart.getSVG(); 
}, args); 

// Saving SVG to a file 
fs.write("test.svg", svg); 
// Saving diagram as PDF 
//setTimeout(function(){ 
page.render('test.png', {format: 'png', quality: '100'}); 

phantom.exit(); 

Это создает и сохраняет файл png (хотя размеры не установлены).

Что я понял, так это то, что я не могу использовать PHP в этом файле. Звонок exec() никогда не возвращается, и я просто закончу его отмену. Я предполагаю, что это потому, что PhantomJS не знает, что делать, когда он сталкивается с <?php тегами.

Каков наилучший способ опробовать данные DB с помощью PHP для создания и сохранения диаграмм?

Answer 1

Я работаю над интеграцией PhantomJS, чтобы помочь создать изображения на моем сервере, которые затем могут быть использованы в шаблоне HTML и сохранены в PDF с использованием mPDF.

Это звучит как слишком сложный способ выполнить вашу задачу. Знаете ли вы, что PhantomJS также может создавать PDF?

page.render('charts.pdf'); 

Так что я бы предложил создать обычный HTML-страницу (из приложения YII2) со всеми необходимыми графиками на него, а затем просто сделать его в PDF с PhantomJS.

---

Если, однако, вы хотите использовать переменные из PHP в вашем PhantomJS сценарии в любом случае, есть, конечно, способов сделать это. Вы были на правильном пути, думая, что с PHP вы можете генерировать сценарий динамически. Но перед тем, как передать этот сценарий PhantomJS, он должен обрабатываться PHP.

Поскольку вы уже используете инфраструктуру MVC, я бы предложил следующее: создать шаблон для вашего js-скрипта (который будет, по существу, представлением/частичным), загрузить его как представление, передать данные для диаграммы его и создать допустимый скрипт, вставляя динамические переменные везде, куда им нужно идти. Что-то вроде этого:

В модели приложения/контроллер подготовить данные соответственно (псевдокод, я не сделал Yii):

$series = array(); 
foreach ($data as $line) 
{ 
    $series[] = array(
     "type" => 'column', 
     "name" => $line['name'], 
     "data" => $line['data'] 
    ); 
} 
$this->view->params['series'] = $series; 

Затем передать его для просмотра и использовать так:

var chart = new Highcharts.Chart({ 
    ... 
    series: <?php echo json_encode($this->params['series']); ?> 
    ... 
}); 

Затем вместо отправки вывода в браузер ухватите его и сохраните во временный файл, а затем передайте имя файла в качестве аргумента для PhantomJS.