cleaned JS for tooltips
This commit is contained in:
110
js/pMap.js
110
js/pMap.js
@@ -1,7 +1,9 @@
|
|||||||
/*
|
/*
|
||||||
pMap - a JavaScript to add image map support to pChart graphs!
|
pMap - a JavaScript to add image map support to pChart graphs!
|
||||||
Copyright (C) 2008 Jean-Damien POGOLOTTI
|
Copyright (C) 2008 Jean-Damien POGOLOTTI
|
||||||
|
Copyright (C) 2010 Martynas Mickevicius
|
||||||
Version 1.1 last updated on 08/20/08
|
Version 1.1 last updated on 08/20/08
|
||||||
|
Version 1.2 last updated on 07/22/10
|
||||||
|
|
||||||
http://pchart.sourceforge.net
|
http://pchart.sourceforge.net
|
||||||
|
|
||||||
@@ -19,51 +21,32 @@
|
|||||||
along with this program. If not, see <http://www.gnu.org/licenses/>.
|
along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
var pMap_IE = document.all?true:false;
|
var imageMap = {
|
||||||
var pMap_ImageMap = new Array();
|
'mouseMoved': function(event, cont) {
|
||||||
var pMap_ImageID = "";
|
// get mouse coordinated relative to image
|
||||||
var pMap_MouseX = 0;
|
mouseX = event.pageX - cont.offsetLeft;
|
||||||
var pMap_MouseY = 0;
|
mouseY = event.pageY - cont.offsetTop;
|
||||||
var pMap_CurrentKey = -1;
|
|
||||||
var pMap_URL = "";
|
|
||||||
var pMap_Tries = 0;
|
|
||||||
var pMap_MaxTries = 5;
|
|
||||||
var pMap_HTTP_Timeout = 1000;
|
|
||||||
var pMap_MUTEX = false;
|
|
||||||
var pMap_MUTEX_Timeout = 100;
|
|
||||||
|
|
||||||
if (!pMap_IE) { document.captureEvents(Event.MOUSEMOVE); }
|
//console.log("X: " + mouseX + ", Y: " + mouseY);
|
||||||
|
|
||||||
function getMousePosition(e)
|
//return;
|
||||||
{
|
|
||||||
/* Protect against event storm */
|
|
||||||
if (pMap_MUTEX) { return(0);}
|
|
||||||
pMap_MUTEX = true;
|
|
||||||
setTimeout("pMap_MUTEX=false",pMap_MUTEX_Timeout);
|
|
||||||
|
|
||||||
/* Determine mouse position over the chart */
|
|
||||||
if (pMap_IE)
|
|
||||||
{ pMap_MouseX = event.clientX + document.body.scrollLeft; pMap_MouseY = event.clientY + document.body.scrollTop; }
|
|
||||||
else
|
|
||||||
{ pMap_MouseX = e.pageX; pMap_MouseY = e.pageY; }
|
|
||||||
pMap_MouseX -= document.getElementById(pMap_ImageID).offsetLeft;
|
|
||||||
pMap_MouseY -= document.getElementById(pMap_ImageID).offsetTop;
|
|
||||||
|
|
||||||
/* Check if we are flying over a map zone
|
/* Check if we are flying over a map zone
|
||||||
* Lets use the following method to check if a given
|
* Lets use the following method to check if a given
|
||||||
* 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;
|
found = false;
|
||||||
for (Key in pMap_ImageMap)
|
for (key in this.imageMap)
|
||||||
{
|
{
|
||||||
Values = Key.split("--");
|
values = key.split("--");
|
||||||
SeriesName = Values[0];
|
seriesName = values[0];
|
||||||
SeriesValue = Values[1];
|
seriesValue = values[1];
|
||||||
SignSum = 0;
|
|
||||||
for (i = 0; i <= pMap_ImageMap[Key].length - 1; i++)
|
signSum = 0;
|
||||||
|
for (i = 0; i <= this.imageMap[key].length - 1; i++)
|
||||||
{
|
{
|
||||||
if (i == pMap_ImageMap[Key].length - 1)
|
if (i == this.imageMap[key].length - 1)
|
||||||
{
|
{
|
||||||
index1 = i;
|
index1 = i;
|
||||||
index2 = 0;
|
index2 = 0;
|
||||||
@@ -73,34 +56,51 @@
|
|||||||
index1 = i;
|
index1 = i;
|
||||||
index2 = i+1;
|
index2 = i+1;
|
||||||
}
|
}
|
||||||
result = getDeterminant(
|
result = this.getDeterminant(
|
||||||
pMap_ImageMap[Key][index1][0],
|
this.imageMap[key][index1][0],
|
||||||
pMap_ImageMap[Key][index1][1],
|
this.imageMap[key][index1][1],
|
||||||
pMap_ImageMap[Key][index2][0],
|
this.imageMap[key][index2][0],
|
||||||
pMap_ImageMap[Key][index2][1],
|
this.imageMap[key][index2][1],
|
||||||
pMap_MouseX,
|
mouseX,
|
||||||
pMap_MouseY
|
mouseY
|
||||||
);
|
);
|
||||||
if (result > 0) { SignSum += 1; } else { SignSum += -1; }
|
if (result > 0) { signSum += 1; } else { signSum += -1; }
|
||||||
}
|
}
|
||||||
//console.log(Key+": "+SignSum);
|
//console.log(Key+": "+SignSum);
|
||||||
if (Math.abs(SignSum) == pMap_ImageMap[Key].length)
|
if (Math.abs(signSum) == this.imageMap[key].length)
|
||||||
{
|
{
|
||||||
Found = true;
|
found = true;
|
||||||
if ( pMap_CurrentKey != Key )
|
if (this.currentKey != key)
|
||||||
{ overlib(SeriesValue, CAPTION, SeriesName, WIDTH, 80); pMap_CurrentKey = Key; }
|
{
|
||||||
|
overlib(seriesValue, CAPTION, seriesName, WIDTH, 80);
|
||||||
|
this.currentKey = key;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if ( !Found && pMap_CurrentKey != -1 ) { nd(); pMap_CurrentKey = -1; }
|
|
||||||
}
|
}
|
||||||
|
if (!found && this.currentKey != -1 )
|
||||||
|
{
|
||||||
|
nd();
|
||||||
|
this.currentKey = -1;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
function getDeterminant(X1, Y1, X2, Y2, X3, Y3)
|
'getDeterminant': function (X1, Y1, X2, Y2, X3, Y3) {
|
||||||
{
|
|
||||||
return (X2*Y3 - X3*Y2) - (X1*Y3 - X3*Y1) + (X1*Y2 - X2*Y1);
|
return (X2*Y3 - X3*Y2) - (X1*Y3 - X3*Y1) + (X1*Y2 - X2*Y1);
|
||||||
}
|
},
|
||||||
|
|
||||||
function LoadImageMap(ID, map)
|
'loadImageMap': function(map) {
|
||||||
{
|
imageMap.imageMap = JSON.parse(map);
|
||||||
pMap_ImageID = ID;
|
},
|
||||||
pMap_ImageMap = JSON.parse(map);
|
|
||||||
|
'init': function() {
|
||||||
|
$("img#chart").bind('mousemove',function(e) {
|
||||||
|
imageMap.mouseMoved(e, this);
|
||||||
|
});
|
||||||
|
|
||||||
|
this.currentKey = -1;
|
||||||
}
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
$(document).ready(function() {
|
||||||
|
imageMap.init()
|
||||||
|
});
|
||||||
|
@@ -134,10 +134,10 @@ abstract class PMA_pChart_Chart extends PMA_Chart
|
|||||||
$this->prepareChart();
|
$this->prepareChart();
|
||||||
$this->render();
|
$this->render();
|
||||||
|
|
||||||
$returnData = '<img id="chart" src="data:image/png;base64,'.$this->imageEncoded.'" OnMouseMove="getMousePosition(event);" OnMouseOut="nd();"/>';
|
$returnData = '<img id="chart" src="data:image/png;base64,'.$this->imageEncoded.'" />';
|
||||||
$returnData .= '
|
$returnData .= '
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
LoadImageMap("chart", \''.json_encode($this->getImageMap()).'\');
|
imageMap.loadImageMap(\''.json_encode($this->getImageMap()).'\');
|
||||||
</script>
|
</script>
|
||||||
';
|
';
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user