JIT: JavaScript Information Visualization Toolkit

ByLuis

Impresionante la librería que ha creado Nicolas Garcia Belmonte que permite crear gráficas RGraph, Treemaps o Hyperbolic Trees. ¿Y qué tipo de gráficas son estas? pues explicándolo llanamente, las que muestran relación entre elementos usándo árboles, pero algo más visuales, centrando nodos.
jit.png
Por lo poco que he visto, está desarrollado en Canvas y para IE lo simula mediante VML. También estaría bien mirar si permite ampliar nodos dinámicamente.
JIT

Similar Posts

Geolocalización por IP mediante Javascript y JSON

ByLuis

Sencillo script que nos devuelve un JSON con la geolocalización según la IP, usando los datos sacados de iplocationtools.com:

function getLocation(){
script = document.createElement('script')
script.src = 'http://www.nitinh.com/ip_query.php?callback=initialize'
document.body.appendChild(script)
}
function initialize(obj){
document.getElementById('spanLocation').innerHTML = obj['City'] + ', ' + obj['RegionName'] + ', ' + obj['CountryName'];
}

IP Address Geolocation Javascript API : JSON

Vía / korayem

Hapi.js + Vue.js empezando con las routes

Hapi.js + Vue.js empezando con las routes

ByLuis

Empezamos a mostrar contenido, hasta ahora solo mostraba un error 404 cuando se accedía a la URL del servidor.

Ahora vamos a añadir una route simple que muestre un objeto JSON cuando se acceda a la home. Recordad que la parte del servidor solo va a devolver respuestas JSON que tratará el frontend.

Usaremos plugins para tratar todas las rutas que incluiremos en glue. En este ejemplo tan solo añadiremos un route al server que devuelva un mensaje:

const Config = require( '../config' );

const websiteName = Config.get( '/website/name' );

const register = function( server, serverOptions ) { // eslint-disable-line
	server.route( {
		method: 'GET',
		path: '/',
		options: {
			tags: [ 'api', 'home' ],
			description: 'Server home',
			notes: 'Server home',
			auth: false,
		},
		handler: function( request, h ) { // eslint-disable-line
			return {
				message: `Welcome to ${ websiteName }`,
			};
		},
	} );
};

module.exports = {
	name: 'api-home',
	dependencies: [],
	register,
};

Ahora solo falta añadir el plugin en el manifest.js

const manifest = {
	server: {
		port: Config.get( '/server/port' ),
	},
	register: {
		plugins: [
			{
				plugin: './api/home',
			},
		],
	},
};

Puedes bajarte el código aquí

|

Picasa jQuery Plugin

ByLuis

A simple jQuery plugin to get albums and images from Picasa without the need for PHP, Ruby, or any other server side language. Makes it easy to create a simple, dynamic, free, client-side-only image gallery. …

Post original

CodeMirror: consola Javascript para tus páginas web

ByLuis

CodeMirror es una librería realizada con MochiKit que nos permite incluir una consola de Javascript en nuestras aplicaciones web. Un ejemplo perfecto para el funcionamiento es el libro de Javascript online Eloquent Javascript, el cual muestra ejemplos javascript y usa la consola para poder ejecutarlos.

codemirror.png

Nos muestra el código parseado y resaltado, además nos permite modificarlo y ejecutarlo, viendo los resultados en una ventana diferente.

Además es sencillo de utilizar:

var editor = new CodeMirror(CodeMirror.replace("inputfield"), {
parserfile: ["tokenizejavascript.js", "parsejavascript.js"],
path: "lib/codemirror/",
stylesheet: "lib/codemirror/jscolors.css"
});

CodeMirror