Ya os hablé una vez de cuanto se usaba cada letra de media en Español, pero eso solo eran datos. Hoy os traigo algo más entretenido para que comprobéis que porcentaje de letras utilizáis vosotros mismos. Solo tenéis que escribir lo que queráis en el cuadro de texto y podréis ver un gráfico con los porcentajes de cada letra. Si el texto es muy largo seguramente se parezca a la media que os conté la otra vez.
¿Se parece a los porcentajes del otro post? ¿Cuál es la letra que más utilizas?
El programa no cuenta caracteres extraños como á, é, ñ, ç, … ¡viva el inglés! Recordad que necesitáis estar en el navegador y no en el lector RSS para poder probarlo.
Escribe el texto que quieras
Para los que quieran saber como funciona el programa en Javascript, os lo dejo aquí el código, he utilizado jQuery y JSCharts para generar los gráficos. El script principal es el siguiente:
var v = new Array(26);
var abecedario = new Array('a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z');
// Cada vez que dejemos de pulsar una tecla
$("#texto_letras_j").keyup(function() {
$("#contador_letras_j").text("");
for(i = 0; i < v.length; ++i) v[i] = 0;
var arr = $("#texto_letras_j").val();
var cont = 0;
// Recorremos todo el texto para analizar cada letra
for(i = 0; i < arr.length; ++i) {
// Comprobamos que sea una letra y la añadimos
if(/[a-z]/.test(arr.charAt(i))){
++cont;
++v[arr.charCodeAt(i)-'a'.charCodeAt(0)];
}
else if(/[A-Z]/.test(arr.charAt(i))) {
++cont;
++v[arr.charCodeAt(i)-'A'.charCodeAt(0)];
}
}
if(cont != 0) {
var myData = new Array(26);
// Escribimos los resultados
for(i = 0; i < v.length; ++i) {
var res = 100*v[i]/cont;
myData[i] = [abecedario[i], res];
$("#contador_letras_j").append("<li>"+abecedario[i]+": "+res.toFixed(3)+"%</li>");
}
// Generamos el gráfico de JSCharts
var myChart = new JSChart('grafico_letras_j', 'bar');
myChart.setTitle('Uso letras');
myChart.setAxisNameY('%');
myChart.setAxisNameX('Letras');
myChart.setDataArray(myData);
myChart.setBarColor('#42aBdB');
myChart.setBarOpacity(0.8);
myChart.setBarBorderColor('#D9EDF7');
myChart.setBarValues(false);
myChart.setTitleColor('#8C8383');
myChart.setAxisColor('#777E81');
myChart.setAxisValuesColor('#777E81');
myChart.setSize(616, 321);
myChart.draw();
}
else {
$("#grafico_letras_j").text("");
}
});
});
Además, para que funcione, debemos añadir lo siguiente al HTML
El resultado final del HTML será el siguiente:
<script src="/jscharts.js" type="text/javascript"</script>
<script src="/cuenta_letras.js" type="text/javascript"></script>
<textarea id="texto_letras_j"></textarea>
<div id="grafico_letras_j>Escribe el texto que quieras</div>
<ul id="contador_letras_j"></ul>
- Los scripts Javascript.
- El cuadro de texto (texto_letras_j).
- Un div para colocar el gráfico (grafico_letras_j).
- Una lista y un párrafo (contador_letras_j) para guardar los resultados.
): 696.000 km.
km.
km.