elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Trabajando con las ramas de git (tercera parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web
| | |-+  PHP (Moderador: #!drvy)
| | | |-+  Crear graficos dinamicos sin base de datos
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Crear graficos dinamicos sin base de datos  (Leído 2,016 veces)
archowl

Desconectado Desconectado

Mensajes: 4


Ver Perfil
Crear graficos dinamicos sin base de datos
« en: 3 Diciembre 2016, 19:08 pm »

Hola  buenas,

saben estoy haciendo un proyecto con  gráficos  hightcharts donde tomo los valores desde un archivo de text y los inserta en una tabla y luego genera el gráfico.

lo que no puedo hacer es que yo tengo  una lista opciones para crear donde debo hacer como un reporte de ventas  por meses, otro por periodo de 12 meses y uno total.
pero no logro hacer que con selec option encontrar la variable que identifica cada mes para poder hacer una tabla especifica para cada mes y su correspondiente gráfico (esto tmb estoy viendo como hacerlo).

alguna idea o ayuda concreta que puedan coperar.
de antemano muchas gracias

aqui el código que tengo
Código
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4. <head>
  5.  
  6.    <meta charset="utf-8">
  7.    <meta http-equiv="X-UA-Compatible" content="IE=edge">
  8.    <meta name="viewport" content="width=device-width, initial-scale=1">
  9.    <meta name="description" content="">
  10.    <meta name="author" content="">
  11.  
  12.    <title>Bare - Start Bootstrap Template</title>
  13.    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
  14.  
  15.   <body>
  16.    </head>
  17.        <nav class="navbar navbar-inverse navbar-fixed-top"  role="navigation">
  18.        <div class="container">
  19.            <!-- Brand and toggle get grouped for better mobile display -->
  20.            <div class="navbar-header" >
  21.                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
  22.                    <span class="sr-only">Toggle navigation</span>
  23.                    <span class="icon-bar"></span>
  24.                    <span class="icon-bar"></span>
  25.                    <span class="icon-bar"></span>
  26.                </button>
  27.                <a class="navbar-brand" href="#">Start Bootstrap</a>
  28.            </div>
  29.            <!-- Collect the nav links, forms, and other content for toggling -->
  30.            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
  31.                <ul class="nav navbar-nav">
  32.                    <li>
  33.                        <a href="#">About</a>
  34.                    </li>
  35.                    <li>
  36.                        <a href="#">Services</a>
  37.                    </li>
  38.                    <li>
  39.                        <a href="#">Contact</a>
  40.                    </li>
  41.                </ul>
  42.            </div>
  43.            <!-- /.navbar-collapse -->
  44.        </div>
  45.        <!-- /.container -->
  46.    </nav>
  47.  
  48.    <!-- Page Content -->
  49.    <div class="container">
  50.  
  51.    <script>
  52.        var nombres = [];
  53.        var valores = [];
  54.    </script>    
  55.  
  56.    </div>
  57.    <br>
  58.    <br>
  59.    <br>
  60.    <br>
  61.    <br>
  62.    <br>
  63.  
  64.    <p id="demo"></p>
  65.  
  66. <script>
  67. function meses() {
  68.    var x = document.getElementById("mes");
  69.    var i = x.selectedIndex;
  70.    document.getElementById("demo").innerHTML = x.options[i].text;
  71. }
  72. </script>
  73.    <div class="col-lg-12" >
  74.        <form  method="post" action="" enctype="multipart/form-data">
  75.            <input type='file' name="archivo"  ><br>
  76.            <input type="submit" value="Ingresar" name="boton">
  77.  
  78.  
  79.        </form>
  80.             <br>
  81.             <div ><h4>meses</h4>
  82.            <select id="meses" onchange="ChangemesList()">
  83.            <option value="marzo">Marzo</option>
  84.            <option value="abril">Abril</option>
  85.            <option value="mayo">Mayo</option>
  86.            <option value="junio">Junio</option>
  87.            <option value="julio">julio</option>
  88.            <option value="agosto">agosto</option>
  89.            <option value="septiembre">septiembre</option>
  90.            <option value="octubre">octubre</option>
  91.            <option value="noviembre">noviembre</option>
  92.            <option value="diciembre">diciembre</option>
  93.            <option value="enero">enero</option>
  94.            <option value="febrero">Febrero</option>
  95.            </select>  
  96.  
  97.            <select id="años"></select>
  98.  
  99.  
  100.  
  101.  
  102.  
  103.  
  104.             <div><h4>Periodos</h4>
  105.           <select id="periodo" onchange="ChangeperiodoList()">
  106.            <option value="periodo1">enero-diciembre año 1</option>
  107.            <option value="periodo2">enero-diciembre año 2</option>
  108.            <option value="periodo3">enero-diciembre año 3</option>
  109.            </select>
  110.            </div>
  111.  
  112.  
  113.    </div>
  114.    <script>
  115.        var mesesandaños = {};
  116.            mesesandaños['marzo'] = ['1er año', '2do año', '3er año'];
  117.            mesesandaños['abril'] = ['1er año', '2do año', '3er año'];
  118.            mesesandaños['mayo'] = ['1er año', '2do año', '3er año'];
  119.            mesesandaños['junio'] = ['1er año', '2do año', '3er año'];
  120.            mesesandaños['julio'] = ['1er año', '2do año', '3er año'];
  121.            mesesandaños['agosto'] = ['1er año', '2do año', '3er año'];
  122.            mesesandaños['septiembre'] = ['1er año', '2do año', '3er año'];
  123.            mesesandaños['octubre'] = ['1er año', '2do año', '3er año'];
  124.            mesesandaños['noviembre'] = ['1er año', '2do año', '3er año'];
  125.            mesesandaños['diciembre'] = ['1er año', '2do año', '3er año'];
  126.            mesesandaños['enero'] = ['1er año', '2do año', '3er año'];
  127.            mesesandaños['febrero'] = ['1er año', '2do año', '3er año'];
  128.  
  129.  
  130.  
  131.        function ChangemesList() {
  132.         var mesesList = document.getElementById("meses");
  133.         var añosList = document.getElementById("años");
  134.         var selmes = mesesList.options[mesesList.selectedIndex].value;
  135.    while (añosList.options.length) {
  136.        añosList.remove(0);
  137.    }
  138.    var meses = mesesandaños[selmes];
  139.    if (meses) {
  140.        var i;
  141.        for (i = 0; i < meses.length; i++) {
  142.            var mes = new Option(meses[i], i);
  143.            añosList.options.add(mes);
  144.        }
  145.    }
  146. }
  147. </script>
  148.        <br>        
  149.    <?php
  150.        if(isset($_POST['boton'])){
  151.            $nombreArchivo = $_FILES['archivo']['name'];
  152.            error_reporting(E_ALL ^ E_NOTICE);
  153.            $file = fopen($nombreArchivo, "r");
  154.            while(!feof($file)) {
  155.                $contenido = $contenido.fgets($file);
  156.            }
  157.            fclose($file);
  158.  
  159.    ?>
  160.  
  161.    <div class="table-responsive col-md-5">
  162.        <table class="table table-striped table-bordered" >
  163.            <thead>
  164.                <tr>
  165.                    <th>Producto</th>
  166.                    <th>Valores</th>
  167.                </tr>
  168.            </thead>
  169.            <tbody>
  170.                <?php
  171.                $cosas = explode("&", $contenido);
  172.  
  173.                }
  174.                for($i =0; $i<count($cosas); $i++){
  175.                    $campos = explode(",", $cosas[$i]);
  176.                    $nombre = $campos[0];
  177.                    $valor = $campos[1];
  178.                    $mes= $campos[3];
  179.                    $año= $campos[4];
  180.                    echo '<tr><th>'.$nombre.'</th><th><br>'.$valor.'</th></tr>';
  181.                    ?>            
  182.                <script>
  183.  
  184.                    nombres.push(<?php echo json_encode($nombre) ?>);
  185.                    valores.push(<?php echo json_encode($valor) ?>);
  186.                </script>
  187.            </tbody>
  188.        </table>
  189.    </div>
  190.  
  191.    <div class=" col-md-5">
  192.        <div id="grafico"></div>
  193.    </div>
  194.  
  195.    <script src="bootstrap/js/jquery.js"></script>
  196.    <script src="bootstrap/js/bootstrap.min.js"></script>
  197.    <script src="highcharts/highcharts.js"></script>
  198.    <script src="highcharts/exporting.js"></script>
  199.    <script src="javascript/funciones.js"></script>
  200.  
  201.  
  202.   </body>
  203.  





En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Crear un ainterfaz que lea base de datos
.NET (C#, VB.NET, ASP)
Meta 3 2,875 Último mensaje 14 Julio 2009, 21:21 pm
por MANULOMM
Crear Base de Datos Web.
Desarrollo Web
Fx Hound 3 3,031 Último mensaje 15 Junio 2010, 09:50 am
por n3fisto
Crear base de datos de sql.
.NET (C#, VB.NET, ASP)
Zeroql 1 2,141 Último mensaje 18 Julio 2010, 05:44 am
por 43H4FH44H45H4CH49H56H45H
crear una base de datos en c
Programación C/C++
super-marya 3 31,098 Último mensaje 30 Agosto 2010, 15:37 pm
por clodan
crear una base de datos...
Programación General
Chazy Chaz 2 4,014 Último mensaje 13 Octubre 2011, 13:31 pm
por Chazy Chaz
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines