Function runs twice on click (jQuery)
Why init function runs twice?
HTML code:
<!DOCTYPE html>
<html>
<head>
<script src="js/jquery.js"></script>
<script src="js/main.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="js/sigma.min.js"></script>
<script src="js/main.js"></script>
<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
</head>
<body style="background-color:#E8E8E8;">
<img src="logo_clear.png" style="float:right">
<h3
style="text-align:center;font-family:arial;color:#003366;font-size:20px;">Your
search results for MP3:</h3>
<div id="sig" style="height:500px; width:500px;
background:#cccccc;"></div>
<input type="button" id="graph_btn" value="show graph" />
</body>
</html>
JS code:
$(document).ready(function()
{
$('#graph_btn').on('click', function()
{
init();
alert();
});
});
function init()
{
var sigInst =
sigma.init(document.getElementById('sig')).drawingProperties
({
defaultLabelColor: '#000',
defaultLabelSize: 14,
defaultLabelBGColor: 'green',
defaultLabelHoverColor: '#fff',
labelThreshold: 1,
defaultEdgeType: 'curve'
}).graphProperties
({
minNodeSize: 0.5,
maxNodeSize: 5,
minEdgeSize: 1,
maxEdgeSize: 1
}).mouseProperties
({
maxRatio: 4
});
sigInst.addNode('hello',{ label: 'Hello',color: 'red', x:
Math.random(), y: Math.random(), size: 0.5+4.5*Math.random()});
sigInst.addNode('world',{ label: 'World !',color: 'blue', x:
Math.random(), y: Math.random(), size: 0.5+4.5*Math.random()});
sigInst.addNode('Gosha',{ label: 'Gosha !',color: 'black', x:
Math.random(), y: Math.random(), size: 0.5+4.5*Math.random()});
sigInst.addEdge('hello_world','hello','world');
sigInst.addEdge('gosha_world','Gosha','world');
sigInst.draw();
}
I have tried different jquery functions like: .on and `.live'. still
getting the same result.
Thanks!
No comments:
Post a Comment