nettika/phpmyadmin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

image map enchancements.

Browse Source
This commit is contained in:
Martynas Mickevicius
2010-07-29 19:06:11 +03:00
parent 88b9e72597
commit 57614902eb
3 changed files with 97 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
js/pMap.js
View File

@@ -24,8 +24,8 @@
var imageMap = { var imageMap = {
'mouseMoved': function(event, cont) { 'mouseMoved': function(event, cont) {
// get mouse coordinated relative to image // get mouse coordinated relative to image
mouseX = event.pageX - cont.offsetLeft; var mouseX = event.pageX - cont.offsetLeft;
mouseY = event.pageY - cont.offsetTop; var mouseY = event.pageY - cont.offsetTop;
//console.log("X: " + mouseX + ", Y: " + mouseY); //console.log("X: " + mouseX + ", Y: " + mouseY);
@@ -34,17 +34,19 @@ var imageMap = {
* point is in any convex polygon. * point is in any convex polygon.
* http://www.programmingforums.org/post168124-3.html * http://www.programmingforums.org/post168124-3.html
*/ */
found = false; var found = false;
for (key in this.imageMap) for (var key = 0; key < this.imageMap.length; key++)
{ {
values = key.split("--"); var seriesName = this.imageMap[key]['n'];
seriesName = values[0]; var seriesValue = this.imageMap[key]['v'];
seriesValue = values[1];
signSum = 0; var signSum = 0;
for (i = 0; i <= this.imageMap[key].length - 1; i++) for (var i = 0; i < this.imageMap[key]['p'].length; i++)
{ {
if (i == this.imageMap[key].length - 1) var index1;
var index2;
if (i == this.imageMap[key]['p'].length - 1)
{ {
index1 = i; index1 = i;
index2 = 0; index2 = 0;
@@ -54,18 +56,18 @@ var imageMap = {
index1 = i; index1 = i;
index2 = i+1; index2 = i+1;
} }
result = this.getDeterminant( var result = this.getDeterminant(
this.imageMap[key][index1][0], this.imageMap[key]['p'][index1][0],
this.imageMap[key][index1][1], this.imageMap[key]['p'][index1][1],
this.imageMap[key][index2][0], this.imageMap[key]['p'][index2][0],
this.imageMap[key][index2][1], this.imageMap[key]['p'][index2][1],
mouseX, mouseX,
mouseY mouseY
); );
if (result > 0) { signSum += 1; } else { signSum += -1; } if (result > 0) { signSum += 1; } else { signSum += -1; }
} }
if (Math.abs(signSum) == this.imageMap[key].length) if (Math.abs(signSum) == this.imageMap[key]['p'].length)
{ {
found = true; found = true;
if (this.currentKey != key) if (this.currentKey != key)

96
libraries/chart/pChart/pChart.class
View File

@@ -2220,10 +2220,13 @@
} }
$offset = 10; $offset = 10;
$this->addPointToImageMap($X+$vecX*-$offset,$Y+$vecY*-$offset,$Label,$tooltipValue,'Radar'); $poly = array(
$this->addPointToImageMap($X+$vecX*+$offset,$Y+$vecY*+$offset,$Label,$tooltipValue,'Radar'); array($X+$vecX*-$offset,$Y+$vecY*-$offset),
$this->addPointToImageMap($XCenter+$vecX*+$offset,$YCenter+$vecY*+$offset,$Label,$tooltipValue,'Radar'); array($X+$vecX*+$offset,$Y+$vecY*+$offset),
$this->addPointToImageMap($XCenter+$vecX*-$offset,$YCenter+$vecY*-$offset,$Label,$tooltipValue,'Radar'); array($XCenter+$vecX*+$offset,$YCenter+$vecY*+$offset),
array($XCenter+$vecX*-$offset,$YCenter+$vecY*-$offset),
);
$this->addPolyToImageMap($poly,$Label,$tooltipValue,'Radar');
} }
} }
} }
@@ -2777,23 +2780,56 @@
if ( $this->BuildMap ) if ( $this->BuildMap )
{ {
/* Add points to Image Map. // Add points to Image Map.
* The center point abd the first, middle and last of the arc is taken.
*/
foreach ($TopPlots as $key => $PointArr) foreach ($TopPlots as $key => $PointArr)
{ {
$serieName = $Data[$key][$DataDescription['Values'][1]];
$serieValue = $Data[$key][$DataDescription['Values'][0]];
// last point of the arc // last point of the arc
$this->addPointToImageMap($PointArr[count($PointArr)-4],$PointArr[count($PointArr)-3],$Data[$key][$DataDescription['Values'][1]],$Data[$key][$DataDescription['Values'][0]],"Pie"); $lastX = $PointArr[count($PointArr)-4];
$lastY = $PointArr[count($PointArr)-3];
// the point at the middle // the point at the middle
$this->addPointToImageMap($PointArr[0],$PointArr[1],$Data[$key][$DataDescription['Values'][1]],$Data[$key][$DataDescription['Values'][0]],"Pie"); $middleX = $PointArr[0];
$middleY = $PointArr[1];
// firs point in the arc // first point in the arc
$this->addPointToImageMap($PointArr[2],$PointArr[3],$Data[$key][$DataDescription['Values'][1]],$Data[$key][$DataDescription['Values'][0]],"Pie"); $firstX = $PointArr[2];
$firstY = $PointArr[3];
// point in the middle of the arc // point on the first third of the arc
$middle = count($PointArr)/2; $firstThird = count($PointArr)/3;
$this->addPointToImageMap($PointArr[$middle + ($middle % 2)],$PointArr[$middle + ($middle % 2)+1],$Data[$key][$DataDescription['Values'][1]],$Data[$key][$DataDescription['Values'][0]],"Pie"); $firstThirdX = $PointArr[$firstThird + ($firstThird % 2)];
$firstThirdY = $PointArr[$firstThird + ($firstThird % 2)+1];
// point on the second third of the arc
$secondThird = count($PointArr)/3*2;
$secondThirdX = $PointArr[$secondThird + ($secondThird % 2)];
$secondThirdY = $PointArr[$secondThird + ($secondThird % 2)+1];
// Will create three polygons for every piece of the pie. In such way
// no polygon will be concave. JS only works with convex polygons.
$poly = array(
array($middleX,$middleY),
array($firstX,$firstY),
array($firstThirdX,$firstThirdY),
);
$this->addPolyToImageMap($poly,$serieName,$serieValue,"Pie");
$poly = array(
array($middleX,$middleY),
array($firstThirdX,$firstThirdY),
array($secondThirdX,$secondThirdY),
);
$this->addPolyToImageMap($poly,$serieName,$serieValue,"Pie");
$poly = array(
array($middleX,$middleY),
array($secondThirdX,$secondThirdY),
array($lastX,$lastY),
);
$this->addPolyToImageMap($poly,$serieName,$serieValue,"Pie");
} }
} }
@@ -3420,21 +3456,41 @@
/* Add a box into the image map */ /* Add a box into the image map */
function addToImageMap($X1,$Y1,$X2,$Y2,$SerieName,$Value,$CallerFunction) function addToImageMap($X1,$Y1,$X2,$Y2,$SerieName,$Value,$CallerFunction)
{ {
$this->addPointToImageMap($X1,$Y1,$SerieName,$Value,$CallerFunction); $poly = array(array($X1,$Y1),array($X2,$Y1),array($X2,$Y2),array($X1,$Y2));
$this->addPointToImageMap($X2,$Y1,$SerieName,$Value,$CallerFunction); $this->addPolyToImageMap($poly,$SerieName,$Value,$CallerFunction);
$this->addPointToImageMap($X2,$Y2,$SerieName,$Value,$CallerFunction);
$this->addPointToImageMap($X1,$Y2,$SerieName,$Value,$CallerFunction);
} }
function addPointToImageMap($X1,$Y1,$SerieName,$Value,$CallerFunction) function addPolyToImageMap($poly,$SerieName,$Value,$CallerFunction)
{ {
if ( $this->MapFunction == NULL || $this->MapFunction == $CallerFunction) if ( $this->MapFunction == NULL || $this->MapFunction == $CallerFunction)
{ {
$this->ImageMap["$SerieName--$Value"][] = array(round($X1), round($Y1)); $this->ImageMap[] = array(
'n' => (string)$SerieName,
'v' => (string)$Value,
'p' => $poly,
);
$this->MapFunction = $CallerFunction; $this->MapFunction = $CallerFunction;
} }
} }
/* Draw image map to the current chart image */
function debugImageMap()
{
foreach ($this->ImageMap as $polygon)
{
$points = array();
foreach ($polygon['p'] as $point)
{
$points[] = $point[0];
$points[] = $point[1];
}
$color = $this->AllocateColor($this->Picture,rand(0,255),rand(0,255),rand(0,255));
imagefilledpolygon($this->Picture,$points,(count($points)+1)/2,$color);
}
}
/* Load and cleanup the image map from disk */ /* Load and cleanup the image map from disk */
function getImageMap($MapName,$Flush=TRUE) function getImageMap($MapName,$Flush=TRUE)
{ {

4
libraries/chart/pma_pchart_chart.php
View File

@@ -161,7 +161,7 @@ abstract class PMA_pChart_Chart extends PMA_Chart
$output = ob_get_contents(); $output = ob_get_contents();
ob_end_clean(); ob_end_clean();
// encode the current part // base64 encode the current part
$partEncoded = base64_encode($output); $partEncoded = base64_encode($output);
$this->partsEncoded[$i] = $partEncoded; $this->partsEncoded[$i] = $partEncoded;
} }
@@ -174,6 +174,8 @@ abstract class PMA_pChart_Chart extends PMA_Chart
$this->prepareDataSet(); $this->prepareDataSet();
$this->prepareChart(); $this->prepareChart();
//$this->chart->debugImageMap();
if ($this->isContinuous()) { if ($this->isContinuous()) {
$this->render(1); $this->render(1);
} }