Transformons le logiciel d'analyse de Wiire en une application WEB! Premier pas!
Nous automatiserons l'analyse des données de Wiire! Partie 4
■ Présentation
- Bonjour, c'est Yajun.
J'étais tellement occupé ces derniers temps que je ne pouvais pas écrire d'article ... (trop)
Cet article présente ** la trajectoire de la première étape vers «faire une application WEB» du logiciel créé **.
- Cet article est une série, il est donc recommandé de le lire avec l'article précédent.
- Le logiciel de cet article est écrit en Python. ■ URL de référence
■ Objectif
- Comme première étape pour en faire une application WEB
J'ai décidé de "créer un graphique qui fonctionne de manière interactive dans le navigateur".
- L'auteur n'a ni expérience ni connaissance de la création d'applications WEB.
■ Sélection de la bibliothèque
(La figure montre un exemple d'application créée avec Dash! Cool!)
Je n'ai aucune idée de la richesse future de l'application, donc
Cela aurait pu être bien de le faire avec django! !!
Si vous ne voyez pas le point final de votre projet, je pense que vous pouvez sélectionner une bibliothèque basée sur des extensions.
■ Utilisons-le réellement!
- Cliquez ici pour voir l'apparence de la figurine créée en démo!
- La figure centrale est [écrite dans l'article de la partie 2](https://qiita.com/junya0001000/items/d97e1d3596b85892e767#%E3%83%92%E3%82%B9%E3%83%88%E3% Identique à 82% B0% E3% 83% A9% E3% 83% A0% E6% 95% A3% E5% B8% 83% E5% 9B% B3).
C'est un graphique qui montre comment le troisième paramètre a une relation avec les deux distributions de paramètres sur l'axe X / Y par la couleur et la forme du marqueur.
Les deux figures de droite montrent l '[Estimation de la densité du noyau](https://ja.wikipedia.org/wiki/%E3%82%AB%E3%83%BC%E3%83] des paramètres de l'axe X / Y dans le diagramme central. % 8D% E3% 83% AB% E5% AF% 86% E5% BA% A6% E6% 8E% A8% E5% AE% 9A).
- À peu près "un modèle fait à partir de données mesurées pour estimer des données inconnues qui n'ont pas été mesurées"!
Il est possible de modifier divers paramètres du graphique en entrant dans la liste déroulante à gauche.
Ensuite, j'expliquerai la méthode de fonctionnement en fonction de la liste déroulante à gauche!
▶X-axis & Y-axis
- Vous pouvez sélectionner les paramètres à définir sur l'axe X / Y.
Comme mentionné ci-dessus, l'ensemble de données ici est également lié à la carte de distribution sur la droite.
Dans le Gif ci-dessous, "Ratio au centre de la zone d'attaque" est défini sur l'axe X et "Taux de réussite de réussite" est défini sur l'axe Y.
▶Color & Shape
- Vous pouvez spécifier quels paramètres séparent la forme et la couleur du tracé.
La valeur du jeu de couleurs est également liée à la ligne dans la carte de distribution sur la droite.
Dans le Gif ci-dessous, la couleur et la forme de l'intrigue sont modifiées en fonction de la «victoire», «perte» et «minute» du résultat du match.
▶Divide_Col & Divide_Row
- Si vous avez trop d'informations pour voir le diagramme, vous pouvez diviser le graphique par les paramètres de l'axe X / Y.
Dans le Gif ci-dessous, le graphique est divisé par «victoire», «perte» et «minute» du résultat du match.
■ Avantages de ce changement
- Les avantages sont les deux suivants.
"Il n'est pas nécessaire de réécrire le logiciel pour chaque information"
"Les analystes et les utilisateurs peuvent voir les données en temps réel"
Par exemple, le commentateur du tournoi
"L'équipe contre-basée a du mal dans ce tournoi."
Cependant, le sentiment du commentateur peut ne pas être transmis au public.
Dans une telle situation, en montrant la «possession» et le «nombre de balles capturées» dans un graphique à partir des données du tournoi, cela aide le public à comprendre.
On a l'impression "Bien sûr! Les équipes avec une possession de 45% ou moins peuvent difficilement gagner à partir des données!"
Afin d'élargir le marché et la communauté, il est important de savoir dans quelle mesure nous pouvons abaisser le seuil pour le groupe d'entrée inconnu. Je pense que la visualisation des données est un moyen puissant.
■ Histoire intérieure du développement logiciel
- En fait, il est plus difficile de créer une API à utiliser en interne que de développer une application.
Il faut un sens mathématique pour combiner des algorithmes pour atteindre la capacité souhaitée.
Cependant, je pense qu'il est aussi difficile de créer une interface utilisateur «facile à utiliser», «facile à comprendre» et «cool» que de créer une API.
Le développement conscient de l'utilisateur est amusant et brûlant! Lol
■ Perspectives d'avenir
- Ajoutez les fonctions suivantes.
- Conception de l'application
- Fonction d'enregistrement de compte
- Gestion des données sur les subventions
- Analyse vidéo
(Optical Flow sera mis en œuvre.
Si vous pouvez voir les mouvements de tous les joueurs au moment de la notation, il semble que vous puissiez comprendre quelque chose.
Il est également utilisé dans le vrai football. URL de référence
J'ai fait une enquête approximative sur l'industrie, mais si c'est l'analyse actuelle de l'industrie du football, il vaudrait mieux me payer pour plus d'analyse! Je pensais que c'était Naisho)
▼ À l'avenir, je souhaite rendre les fonctions de base du logiciel disponibles gratuitement et monétiser certains services.
- Analyse vidéo
- Droits d'accès aux données des bibliothèques de données d'autres joueurs
- Analyse du rapport personnel par l'analyste de données (et lauréat de la deuxième place de la politique nationale)
- Distribution de rapports mensuels / hebdomadaires résumant les tendances de tous les utilisateurs
- Analyse par tournoi
Et
■ Fin
- Jusqu'ici pour cette fois! !!
La distribution de l'application est encore loin. Puissance et personnel insuffisants (´; ω; `)
Nous continuerons de le faire, alors restez à l'écoute pour la partie 5! !!
PS: Il y avait peut-être 30 jeux que j'ai demandé aux testeurs de faire. .. .. Transpiration
Seuls Chama et FD ont soumis 30 parties lol
■ URL de référence
- Graphing Libraries
- Dash Layout
- Afficher plusieurs graphiques dans Plotly
- Two graphs, side by side
- In depth documentation
- [Dash] Visualisation des données avec Python Partie 2 [Introduction au rappel]
- Introducing Plotly Express