13 Widgets qui font un affichage de données en temps réel impressionnant

Si vous êtes une personne occupée qui n`a pas vraiment beaucoup de temps pour vérifier les nouvelles tous les jours, mais vous voulez garder à jour avec les derniers événements majeurs tels que les grandes tempêtes, le marché boursier ou des changements majeurs dans le monde entier , un affichage graphique est beaucoup plus efficace.

Video: L'appli du jour #4 Data Widget

Vous avez probablement vu des exemples de certains bureaux de courtier en valeurs mobilières où il y a un moniteur avec beaucoup de tableaux, de graphiques et d`autres graphiques toutes les données d`affichage en temps réel. Ou peut-être que vous pourriez avoir vu ces écrans cool centre de lancement de la NASA avec toutes sortes de données importantes qui défilent sur l`écran.

À mon avis, c`est la meilleure façon de montrer beaucoup d`informations dans un petit espace. Et si vous travaillez avec deux ou trois écrans comme je suis, vous avez l`espace moniteur pour avoir un affichage tout le temps - où vous pouvez vérifier ce qui se passe partout dans le monde avec juste un coup d`oeil.

Dans cet article, je vais vous guider à travers mes efforts pour mettre sur pied ce genre d`affichage à l`aide des outils et des techniques de conception web très simple. Je vais aussi partager 15 des meilleurs widgets de tableau de bord en ligne que je trouve tout au long de l`Internet qui a aidé à construire ce grand écran d`information de l`information mondiale.

Construction d`un affichage en temps réel des données du monde

L`un des premiers endroits que je suis allé pour construire un tel affichage d`information est Netvibes. Aibek a reconnu la valeur de netvibes il y a quelques années, et nous avons couvert souvent le site, par exemple article génial d`Angela sur la façon de l`utiliser pour gérer votre vie.Comment gérer votre vie complètement à l`aide en ligne NetvibesComment gérer votre vie complètement à l`aide en ligne NetvibesLire la suite

Je aime vraiment trop Netvibes, et après avoir lu l`article d`Angela, en fait je commencé à l`utiliser pour organiser des liens et des outils pour chacune des principales tâches que je dois faire en ligne. Il est agréable d`avoir tout en un seul endroit. Cependant, quand j`ai essayé d`utiliser le gadget HTML pour intégrer des widgets dans la page, j`ai remarqué que cela ne fonctionne pas très bien. Vous pouvez redimensionner la largeur, mais la hauteur semble rester fixe - couper des widgets plus importants.

widgets tableau de bord

Après avoir essayé quelques autres sites - Protopage était un autre qui ne fonctionne pas tout à fait raison. Il a ajouté trop d`espace sur les côtés des widgets, et ne permet pas le redimensionnement approprié. Ainsi, après avoir passé trop de temps à essayer de faire des pages pré-existantes fonctionnent, j`ai décidé de se tourner vers la conception d`une page à partir de zéro.Comment faire un portfolio de votre travail en ligne avec ProtopageComment faire un portfolio de votre travail en ligne avec ProtopageLire la suite

Je voulais trouver une solution que l`on puisse faire, quelle que soit l`expérience web-design. Mon WYSIWYG outil de conception Web de choix est kompozer. Le seul inconvénient de cette approche est qu`elle utilise des tables, qui, dans le monde des concepteurs de sites Web est considéré comme archaïque par rapport à l`utilisation de CSS. Mais pour l`amour de la simplicité, nous allons utiliser Nvu et mettre les widgets à droite sur la page.

Voici comment la vue de conception dans Kompozer semble une fois que vous avez inséré une table - dans ce cas, j`utilise un 4 par 4 table, mais vous pouvez faire une taille que vous voulez.

widgets météo

Tout d`abord, faites un clic droit sur la table et modifier les propriétés de sorte que les lignes ne sont pas de couleur (invisible). Le premier widget I inséré dans la cellule supérieure gauche était un widget d`horloge fraîche de clocklink.com. En vertu de ce, j`ai ajouté un widget météo de Accuweather.com - un de mes favoris, car il montre un écran radar graphique fraîche de toute tempête approche.

widgets météo

Dans chaque cas, je clique simplement à l`intérieur de la cellule que je veux insérer le code widget, puis cliquez sur le menu Insertion et choisissez HTML. Il suffit de coller le code du widget dans la fenêtre qui apparaît.

widgets météo

Vous remarquerez peut-être votre widget n`est pas centré, ou il montre trop loin du haut de la cellule. C`est facile à fixer dans Kompozer sans aucune connaissance de codage du tout. Il suffit de faire un clic droit sur la cellule, choisissez les propriétés des cellules de table, puis modifier l`alignement du contenu à tout ce qui convient le mieux.

Nouvelles widget de

Pour tester vos modifications, enregistrez le fichier sur votre ordinateur local en tant que fichier HTML, puis affichez le fichier en utilisant votre navigateur favori. Si vous éprouvez vraiment des problèmes, vous pouvez toujours insérer le code si vous avez vraiment. Dans Kompozer, vous pouvez modifier la page en cliquant sur l`onglet « source ». Par exemple, il y avait deux ou trois cas où je devais juste insérer une pause
pour forcer un espace entre certains des widgets que je placé à l`intérieur de la même cellule.

Nouvelles widget de

Ajout de trois autres des meilleurs widgets que j`ai trouvé que j`avais développé l`affichage d`information en temps réel illustré ci-dessous. Les trois widgets sympas que j`ai ajouté étaient les prix du gaz widget dans gas-cost.net, et les produits widget et taux de change actuels widgets de 100widgets.com.

Nouvelles widget de

Ce sont tous les widgets en temps réel, l`affichage des données actuelles de partout dans le monde. Maintenant, j`ai mis à la seconde des données sur les prix, les taux boursiers et les conditions météorologiques, le tout avec un seul coup d`œil. Mais seulement la moitié de la page Web est rempli, et nous avons beaucoup plus d`informations pour construire sur cette page - deux colonnes plus entières de données pour être exact.

Un autre widget vraiment cool que j`ai ajouté à la page a été le widget de configuration de l`utilisateur à partir 100widgets.com. Cela vous donne des commentaires à l`adresse IP actuelle, les informations de l`ordinateur et Windows / version du navigateur. Ceci est utile lorsque vous êtes sur la route et se connecter à votre page d`un hôtel ou d`une bibliothèque et besoin de connaître votre adresse IP actuelle. J`ai aussi ajouté le très cool Compteurs du monde et les indices boursiers de widgetbox.com.

Un couple d`autres widgets utiles qui méritent d`être mentionnés pour ce type d`affichage en temps réel pleine page - le premier est un widget compte à rebours de widgetbox.com. Lorsque vous définissez, vous lui donnez une date et événement compte à rebours, et il apparaît dans le widget comme un compte à rebours de texte vers cet événement (voir le grand écran montre deux images d`ici en bas).

widgets tableau de bord

Video: Storm Chasers S02E02 HDTV XviD When Parts Fly

Et pas d`affichage de données à la recherche de science-fiction serait complet sans une image pivotée de la terre d`afficher des informations de température en temps réel de tout point de la planète que vous aimez. Vous pouvez obtenir ces données à partir de la Météo-3D widget de de Widgetbox.com.

Dans l`image ci-dessous de mes données en temps réel pleine page tableau de bord, vous pouvez voir le compte à rebours en haut de la page (je l`inséra centré avant la table elle-même), et le monde météo 3d juste en dessous du widget compte à rebours du monde. Dans la dernière colonne du tableau I ajouté le niveau actuel de menace DHS, courbes sexy (Plus pour la décoration que toute autre chose - il a l`air cool), et enfin le widget d`alerte en temps réel de la National Hurricane Center.

widgets de tableau de bord width =

Avec la page enfin terminée, j`ai maintenant accès à l`heure actuelle, la météo locale et mondiale, information sur le marché boursier, les prix actuels du gaz, des alertes ouragan actuels, les niveaux nationaux de menace et bien sûr les charges de données du monde dans le widget du compte à rebours du monde.

Vous pouvez modifier ce type d`affichage avec les informations que vous voulez en recherchant d`autres widgets d`information sur l`un des principaux sites de widget, puis de les insérer dans votre mise en page où vous le souhaitez. la capacité de kompozer au centre facilement et aligner les cellules vous permettra de faire paraître tout l`écran propre et vraiment cool. Une fois que vous avez terminé, vous pouvez télécharger le fichier simplement HTML à votre propre hébergeur afin que vous puissiez y avoir accès partout dans le monde.

Créez votre propre tableau de bord d`information et laissez-nous savoir comment ça se passe. Quels sont les autres widgets utiles avez-vous découvert des informations en temps réel? Partagez-les dans la zone de commentaires ci-dessous - J`aimerais voir ce que les autres widgets sympas trouvés!

Articles connexes