chart is rendered in parts. Fixes the issue with browsers which have limited size on base64 images.
This commit is contained in:
10
js/pMap.js
10
js/pMap.js
@@ -89,11 +89,17 @@ var imageMap = {
|
||||
},
|
||||
|
||||
'loadImageMap': function(map) {
|
||||
imageMap.imageMap = JSON.parse(map);
|
||||
this.imageMap = JSON.parse(map);
|
||||
for (key in this.imageMap)
|
||||
{
|
||||
// FIXME
|
||||
// without this loop image map does not work
|
||||
// on IE8 in the status page
|
||||
}
|
||||
},
|
||||
|
||||
'init': function() {
|
||||
$("img#chart").bind('mousemove',function(e) {
|
||||
$("div#chart").bind('mousemove',function(e) {
|
||||
imageMap.mouseMoved(e, this);
|
||||
});
|
||||
|
||||
|
@@ -21,7 +21,7 @@ abstract class PMA_pChart_Chart extends PMA_Chart
|
||||
protected $dataSet;
|
||||
protected $chart;
|
||||
|
||||
protected $imageEncoded;
|
||||
protected $partsEncoded = array();
|
||||
|
||||
public function __construct($data, $options = null)
|
||||
{
|
||||
@@ -116,14 +116,32 @@ abstract class PMA_pChart_Chart extends PMA_Chart
|
||||
|
||||
protected abstract function drawChart();
|
||||
|
||||
protected function render()
|
||||
protected function render($parts = 1)
|
||||
{
|
||||
$fullWidth = 0;
|
||||
|
||||
for ($i = 0; $i < $parts; $i++) {
|
||||
$partHeight = $this->chart->YSize;
|
||||
$partWidth = round($this->chart->XSize / $parts);
|
||||
$fullWidth += $partWidth;
|
||||
$partX = $partWidth * $i;
|
||||
|
||||
if ($i == $parts - 1) {
|
||||
// compensate for the rounding errors in the last part
|
||||
$partWidth += $this->chart->XSize - $fullWidth;
|
||||
}
|
||||
|
||||
$part = imagecreatetruecolor($partWidth, $partHeight);
|
||||
imagecopy($part, $this->chart->Picture, 0, 0, $partX, 0, $partWidth, $partHeight);
|
||||
|
||||
ob_start();
|
||||
imagepng($this->chart->Picture);
|
||||
imagepng($part, NULL, 9, PNG_ALL_FILTERS);
|
||||
$output = ob_get_contents();
|
||||
ob_end_clean();
|
||||
|
||||
$this->imageEncoded = base64_encode($output);
|
||||
$partEncoded = base64_encode($output);
|
||||
$this->partsEncoded[$i] = $partEncoded;
|
||||
}
|
||||
}
|
||||
|
||||
public function toString()
|
||||
@@ -132,9 +150,13 @@ abstract class PMA_pChart_Chart extends PMA_Chart
|
||||
$this->init();
|
||||
$this->prepareDataSet();
|
||||
$this->prepareChart();
|
||||
$this->render();
|
||||
$this->render(20);
|
||||
|
||||
$returnData = '<img id="chart" src="data:image/png;base64,'.$this->imageEncoded.'" />';
|
||||
$returnData = '<div id="chart">';
|
||||
foreach ($this->partsEncoded as $part) {
|
||||
$returnData .= '<img src="data:image/png;base64,'.$part.'" />';
|
||||
}
|
||||
$returnData .= '</div>';
|
||||
$returnData .= '
|
||||
<script type="text/javascript">
|
||||
imageMap.loadImageMap(\''.json_encode($this->getImageMap()).'\');
|
||||
|
Reference in New Issue
Block a user