Ciao,
nel file principale (qui sotto) utilizzo due bottoni (jquery buttom) che una volta cliccati mi caricano alternativamente nel div "stage" due pagine le quali hanno ulteriori javascript. Con la prima pagina grafici non ho nessun problema i grafici vengono generati correttamente
Mentre la pagina strumenti non vuole saperne di visualizzarsi
La struttura dell direcotory è la seguente
file principale
|___ grafici (directory)
| |_ grafici.php
|___strumenti (directory)
|_____index.html
|_____realtime.txt
Dove sbaglio?
Grazie
Ugo
nel file principale (qui sotto) utilizzo due bottoni (jquery buttom) che una volta cliccati mi caricano alternativamente nel div "stage" due pagine le quali hanno ulteriori javascript. Con la prima pagina grafici non ho nessun problema i grafici vengono generati correttamente
Codice:
<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="utf-8" />
<!-- Html 5 e CSS3 -->
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame Remove this if you use the .htaccess -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<title>Ugo Internet server</title>
<meta name="description" content="Sito internet di Ugo Merlini"/>
<meta name="author" content="Ugo Merlini"/>
<meta name="viewport" content="width=device-width; initial-scale=1.0"/>
<!-- Styles -->
<link rel="stylesheet" type="text/css" href="../../../file_comuni/javascript/jquery_ui/css/jquery-ui.css"/>
<link rel="stylesheet" type="text/css" href="../../../file_comuni/css/5.css"/>
<!-- Jquery javascript -->
<script type="text/javascript" src="../../../file_comuni/javascript/jquery/jquery-1.8.2.js"></script>
<!-- Jquery-ui javascript -->
<script type="text/javascript" src="../../../file_comuni/javascript/jquery_ui/jquery-ui-1.9.1.js"></script>
<script type="text/javascript">
$(function() {
$( "#bottone_dati_in_diretta_principale" ).buttonset();
});
</script>
<script type="text/javascript" >
$(document).ready(function() {
$("#dati_in_diretta_grafici_id").click(function(event){
$('#stage').load('grafici/copy.php');
});
});
</script>
<script type="text/javascript" >
$(document).ready(function() {
$("#dati_in_diretta_strumenti_id").click(function(event){
$('#stage').load('strumenti/index.html');
});
});
</script>
</head>
<body>
<nav id="nav_dati_in_diretta">
<div id="bottone_dati_in_diretta_principale">
<input type="radio" id="dati_in_diretta_grafici_id" name="radio" /><label for="dati_in_diretta_grafici_id">Grafici</label>
<input type="radio" id="dati_in_diretta_strumenti_id" name="radio"/><label for="dati_in_diretta_strumenti_id">Strumenti</label>
</div>
</nav>
<section id="section_dati_in_diretta">
<div id="stage"></div>
</section>
</body>
</html>Mentre la pagina strumenti non vuole saperne di visualizzarsi
Codice:
<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="utf-8" />
<!-- Html 5 e CSS3 -->
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame Remove this if you use the .htaccess -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>Ugo Internet server - dati in diretta strumenti</title>
<meta name="description" content="Sito internet di Ugo Merlini"/>
<meta name="author" content="Ugo Merlini" />
<meta name="viewport" content="width=device-width; initial-scale=1.0" />
<!-- Styles -->
<link rel="shortcut icon" href="/favicon.ico" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
<!-- Jquery javascript -->
<script type="text/javascript" src="../../../../file_comuni/javascript/jquery/jquery-1.8.2.js"></script>
<!-- Stessseries javascript -->
<script type='text/javascript' src='../../../../file_comuni/javascript/steelseries/tween.js'></script>
<script type='text/javascript' src='../../../../file_comuni/javascript/steelseries/steelseries.js'></script>
<script type='text/javascript' >
function init() {
// Define some sections
var sections = Array(steelseries.Section(0, 25, 'rgba(0, 0, 220, 0.3)'),
steelseries.Section(25, 50, 'rgba(0, 220, 0, 0.3)'),
steelseries.Section(50, 75, 'rgba(220, 220, 0, 0.3)'));
// Define one area
var areas = Array(steelseries.Section(75, 100, 'rgba(220, 0, 0, 0.3)'));
// Create one radial gauge
var radial1 = new steelseries.Radial(
'canvas1', {
section: sections,
area: areas,
titleString: 'Test',
unitString: 'Unit',
pointerType: steelseries.PointerType.TYPE8
});
// Create a second radial gauge
var radial2 = new steelseries.Radial(
'canvas2', {
gaugeType: steelseries.GaugeType.TYPE2,
maxValue: 40,
threshold: 30,
section: Array(steelseries.Section(0,40,'rgba(0,255,0,0.3)')),
area: Array(steelseries.Section(30,40,'rgba(255,0,0,0.5)')),
titleString: 'Test',
unitString: 'Unit',
frameDesign: steelseries.FrameDesign.ANTHRACITE,
backgroundColor: steelseries.BackgroundColor.ANTHRACITE,
pointerType: steelseries.PointerType.TYPE11,
pointerColor: steelseries.ColorDef.WHITE,
lcdColor: steelseries.LcdColor.WHITE,
ledColor: steelseries.LedColor.GREEN_LED,
});
// Create a radial bargraph gauge
var radial3 = new steelseries.RadialBargraph(
'canvas3', {
gaugeType: steelseries.GaugeType.TYPE3,
titleString: "Title",
unitString: "Unit",
frameDesign: steelseries.FrameDesign.BLACK_METAL,
backgroundColor: steelseries.BackgroundColor.LIGHT_GRAY,
valueColor: steelseries.ColorDef.YELLOW,
lcdColor: steelseries.LcdColor.YELLOW,
ledColor: steelseries.LedColor.YELLOW_LED,
});
// Let's set some values...
// Start the random update
setInterval(function(){ setRandomValue(radial2) }, 2000);
}
function setRandomValue(gauge)
{
$.get('realtime.txt', function(data) {
gauge.setValueAnimated(data.split('\n')[11]);
//process text file line by line
});
}
</script>
</head>
<body onload="init()">
<canvas id='canvas1' width='200' height='200'>
No canvas in your browser...sorry...
</canvas>
<canvas id='canvas2' width='200' height='200'></canvas>
<canvas id='canvas3' width='200' height='200'></canvas>
</body>La struttura dell direcotory è la seguente
file principale
|___ grafici (directory)
| |_ grafici.php
|___strumenti (directory)
|_____index.html
|_____realtime.txt
Dove sbaglio?
Grazie
Ugo
