J'adore Bobby McFerrin...
A partir de rien, il joue avec le public. <3
J'avais envie de faire un outil de visualisation de données facile d'accès et simple, comme un microservice que je pourrais utiliser par la suite dans une de mes applis...
Comme toujours, avant même de voir si ça existerait pas déjà, je me demande comment faire le truc moi-même et ce que je vais pouvoir apprendre avec...
C'est alors que je me dis que le SVG ce serait bien:
et j'arrive à des résultats pas trop dégueus mais tout se corse (chef-lieu Ajaccio) quand je dois placer le texte (nombres, noms de colonnes etc)
C'est emmerdant à center, c'est emmerdant à redimensionner: bref c'est emmerdant. Pour résumer.
J'en ai tellement chié pour un résultat tellement pas terrible que, d'un coup, je me suis rappelé que mon copain JerryWham avait fait une lib juste pour ça !
Une lib qui permet de transformer des données en graphique au format SVG directement, avec des options de configuration et des rendus différents (ligne, barres, camemberts etc), ça vous tente ? Ben c'est par là :
Je me suis contenté de faire un script qui permet de passer des données et la config à la lib via $_GET
Les clés ne sont donc pas affichées.
api.warriordudimanche.net/grafit/?data=[123,321,51,656,89,54,67,56]
Le même avec un graph de surface
api.warriordudimanche.net/grafit/?data=[123,321,51,656,89,54,67,56]&filled
Par exemple des données générées par GenContent
api.warriordudimanche.net/grafit/?color=FF0000&data={"01/08/18":"2822","28/11/19":"5320","01/05/16":"3856","03/04/19":"5087","25/10/14":"7137","27/12/17":"6365","08/11/15":"6616","01/05/17":"1341","01/08/14":"2742","05/07/20":"4697"}
Ce n'est pas pour visualiser des données épiques, multidimensionnelles ou vraiment très nombreuses (les clés se chevauchent s'il y a trop de données et on peut les masquer en ajoutant hidekeys en paramètre.)
Ce sera sans doute appelé à évoluer mais bon, je me suis bien amusé et j'ai touché du doigt que faire du SVG, ça se fait pas entre deux portes au doigt mouillé...
Et voilà... ça me noue la gorge. Tout est parfait: sa voix, son interprétation, la pureté du son de l'instrument... Et pourtant, c'était pas facile de renouveler cette chanson qui, à force de reprises, avait perdu une grande partie de sa puissance (et je fais partie de ceux qui ont découvert le Black album lors de sa sortie et qui ont vénéré ce morceau )
@SebSauvage Quand la destinée se mêle d'une conversation sur les polices de caractères dans laquelle on aborde le choix de police pour les blocs de code: tu t'aperçois que css-tricks a fait une showcase pour les polices dev...
c'est beau, le destin !
Il y a peu, je vous avais conseillé la lecture de shangri-la de Matthieu Bablet... voilà qu'à la faveur d'un déplacement en ville, j'ai acheté une autre de ses créations: Carbone et Silicium, l'histoire de deux IA androïdes qui traversent l'histoire humaine et leur propre histoire, de bouleversements en avènements, de fins en recommencements...
C'est l'occasion d'un long périple à la beauté parfois sauvage et cruelle que l'on suit par bonds temporels et au cours duquel on s'interroge entre-autres sur la nature de l'humanité.
Les planches sont superbes: comme toujours, les couleurs, les cadrages, les paysages sont magnifiques mais dans cet album, le rendu est plus contemplatif que narratif (pour des raisons que vous découvrirez en lisant l'album) et les dialogues sont au service de ce voyage presque initiatique.
Comme les précédents albums, la réalisation de Carbone et Silicium est parfaite: un papier épais, une reliure tissu, un encrage de qualité... Sans compter qu'avec ses 250 pages, l'histoire prend son temps et on n'a pas l'impression d'avoir terminé avant d'avoir commencé comme avec d'autres albums dont le prix est à peine inférieur (coucou les derniers trolls de troy)
Foncez !
C'est beau !
Utiliser et comprendre les étapes dans les animations css en faisaint une machine de Goldberg...
Faut que je regarde ça de plus près dis-donc...
Une excellente production d'Heliox: un pied articulé pour un éclairage de bureau (qui pourrait être adapté pour servir de support de caméra ou de portable lorsqu'on filme un tuto par exemple...
On y voit notamment comment inclure des écrous dans une pièce imprimée en 3D.
Pas parfait mais impressionnant quand même: prendre un film de 1896 et le transformer en 4K 60FPS donne un aspect très actuel et très naturel à ces personnes... comme si de fantômes du passé ils redevenaient de vraies personnes.
On sent les efforts du réseau de neurones derrière
Il y a quelques années on avait acheté un lit mezzanine + bureau pour mon grand qui avait une petite chambre: c'est un SVÄRTA de chez Ikea.
Puis hier-soir, ma moitié est arrivée avec une idée...
Je monte donc dans la chambre, un mètre ruban et un pied à coulisse à la main, un calepin sous le bras. Je mesure, je note, je réfléchis et je me dis que non seulement c'est possible, mais en plus ça ne coûtera rien.
Avant de démarrer, j'ai réalisé un support pour un des pieds de ce qui deviendra le bureau: en découpant la structure, il y aura un pied à rapprocher de sous le bureau pour gagner de la place.
Voilà le modèle que j'ai modélisé puis imprimé (5h30 quand même)
Créer une galerie d'items CARRÉS et responsive... C'est beau.
Je reçois beaucoup de messages de soutien et des commentaires très pertinents: tellement qu'il est dommage de se contenter de la visibilité des commentaires pour y répondre... ils méritent un article à eux seuls.
« Terre brûlée au vent Des landes de pierre ...
Voilà, vous venez d'attraper le connemaravirus. »
Tiens, j'ai trouvé un effet sympa en css sur ce site, je l'ai récupéré et mis là... (je sais pas si j'ai tellement le droit, mais bon )
<style type="text/css">
div.tr1 img {
-webkit-transform: translateX(60px) translateY(-160px) rotateX(45deg) rotateZ(-20deg);
-moz-transform: translateX(60px) translateY(-160px) rotateX(45deg) rotateZ(-20deg);
-ms-transform: translateX(60px) translateY(-160px) rotateX(45deg) rotateZ(-20deg);
-o-transform: translateX(60px) translateY(-160px) rotateX(45deg) rotateZ(-20deg);
-webkit-transition: transform 1s;
transition: transform 1s;
}
div.tr1 img:hover{
-webkit-transform: translateX(0) translateY(0) rotateX(0) rotateZ(0);
-moz-transform: translateX(0) translateY(0) rotateX(0) rotateZ(0);
-ms-transform: translateX(0) translateY(0) rotateX(0) rotateZ(0);
-o-transform: translateX(0) translateY(0) rotateX(0) rotateZ(0);
-webkit-transition: transform 1s;
transition: transform 1s;
}
div.tr1{
width:512px;
height:256px;
overflow:hidden;
border-radius:5px;
border:1px solid rgba(0,0,0,0.2);
background:black;
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
}
</style>
<div class="tr1">
<img src="https://www.pdfannotator.com/images/pdfannotator/fr/screenshot.png">
</div>
Je ne connaissais pas... c'est sérieux ce truc ? Smartphone de 5 pouces avec une bonne caméra, un bon écran, un écran eink au dos comme liseuse etc... J'en peux plus des 6 pouces et plus: impossible de les utiliser à une main.
Mais c'est pile poil ce que je prendrais si je devais en acheter un maintenant (et si mon Nokia n'était pas parti en HONGRIE pour un retour atelier.)
Personne n'aurait un tel fixe à cadran rotatif ? ce serait pour finaliser un retour aux années 80 qui va s'éterniser...