6 de mayo de 2015

Crear un chart D3 en WaveMaker

Bueno les queria dejar un poco de codigo para incrustar bar chart series d3js en wavemaker 6.x

mas que todo hay que usar un widget html en incluir un tag div para poder llenar alli el chart


 y por su puesto referenciar a d3js y si quiere tambien usar d3 tip pues lo mismo agregar esa referencia.

  <script src="http://d3js.org/d3.v3.min.js"></script>
   <script src="http://labratrevenge.com/d3-tip/javascripts/d3.tip.v0.6.3.js"></script>.

ya en la pagina que vamos a trabajar creamos un objeto json datos tipo array para poder llenar el chart

data = [];
        data.push({
            year: 1,
            Current: 2704659,
            Cashflow: 4499890,
            Savings: 2159981
        });
        data.push({
            year: 2,
            Current: 2027307,
            Cashflow: 3277946,
            Savings: 1420518
        });
 en este ejemplo lleno con 2 series para ustedes podrian adquirir los datos desde algun liveVariable en onSuccess

finalmente colocamos el codigo de d3 y solo referenciamos al html widget como

var svg = d3.select("#chart1")

que en este caso es el div id que tenemos en nuestro html widget

les dejo un proyecto de ejemplo mavirroco.com/d3sample1.1.Alpha.zip

suerte espero que les sirva

No hay comentarios:

Mis cosas

Powered By Blogger