Plots2: Erfahren Sie, wie Sie Abonnementstatistiken präsentieren

Wie ist das ?

@dewanhimanshu danke für deinen Vorschlag, aber wenn du dir https://publiclab.org/stats/subscriptions ansiehst, gibt es eine Menge Tags und wenn wir ein Tag für jede Zeile haben, wird die Seite so lang. Meinst du nicht? Hast du vielleicht noch eine andere Idee? Vielen Dank

Ich habe eine Idee, wie man diese Statistiken nicht eintönig und etwas effizienter anzeigen kann, aber es kann sich vom UI-Schema der Site unterscheiden. Möchten Sie ein Mockup @cesswairimu sehen ?

Groß! ja @IshaGupta18. Bitte poste es

Okay, da wir nicht möchten, dass die Seitenlänge auf unbestimmte Zeit anwächst, habe ich daran gedacht, Gruppen von statistischen Werten zu erstellen, wie: 0-5 , 5-10, 10-15 usw. (Klassengröße kann entsprechend angepasst werden) :

Wenn Sie auf eine Blase klicken, wird sie erweitert und zeigt Ihnen die Tags an, die diesen statistischen Wert haben:

Wenn Sie es erneut anklicken / loslassen, wird seine ursprüngliche Form wiederhergestellt.

Wie sieht das aus? Ich dachte, es könnte ein bisschen kreativ und verspielt sein und den Raum reduzieren. Was denkst du @cesswairimu ?

Beeindruckend! @IshaGupta18 Ich liebe diese Idee, sie ist super kreativ und danke für die Arbeit an den Modellen, sie sehen toll aus. Ich glaube, die Werte sind die Anzahl der Abonnenten, oder?
Vielleicht können wir auch bestimmte Tag-Werte in Pop-ups hinzufügen, etwa balloon-mapping -1, mapknitter-2, könnte für Analysezwecke nützlich sein. Was denkst du?

Vielen Dank @cesswairimu ! Ja, sie sind die Anzahl der Abonnenten, wie in den JSON-Daten, außer dass ich Klassenintervalle gemacht habe.
Ja, ich denke, das Hinzufügen von balloon-mapping -1, mapknitter-2 wäre großartig, da es für die Analyse informativer ist!

Fantastisch. Hätten Sie Interesse, dies umzusetzen?

Ja, das würde ich gerne umsetzen! Außerdem würde ich ein weiteres ähnliches Modell vorschlagen, wahrscheinlich mit nur einigen kleinen Änderungen, die das Design verbessern können!

Großartig @IshaGupta18. Vielen Dank

@jywarren Ich wollte, dass du dir mein Design

Das ist sehr cool! So kreativ!

Nur ein paar Gedanken, die das Design ein wenig beeinflussen könnten:

1. wenn dies mit JavaScript implementiert wird, wie zum Beispiel p5js - https://p5js.org/ (könnte mit einer Demo unter https://editor.p5js.org/ beginnen), könnten wir es direkt auf den zu verwendenden JSON verweisen als Quelle
2. das würde bedeuten, dass wir es als eigenständige JS-Visualisierung entwickeln und die ursprüngliche Anzeige von JSON beispielsweise bei /stats/subscription.json oder /stats/subscription/?format=json beibehalten könnten
3. Vielleicht sollten wir in absteigender Reihenfolge anzeigen, damit die beliebtesten Tags oben stehen?
4. Ich denke, dass es großartig wäre, einige der Tag-Namen in der Gesamtansicht anzuzeigen, damit es eine Möglichkeit geben kann, die Daten zu "überfliegen". Irgendwelche Ideen? Vielleicht bedeutet dies ein etwas anderes Layout?
5. in niedrigeren Beliebtheitsskalen wie 0-5 haben wir möglicherweise eine TONNE von Tags. Wenn es zu viele sind, um in den Kreis zu passen, was tun wir?

Ich liebe die Kreisidee. Was wäre, wenn wir die Tags neben den Kreisen anzeigen und eine Reihe von absteigenden Kreisen von groß nach klein die Seite entlang führen würden? Oder eine andere Layout-Idee? Offen für Ideen!

Vielen Dank @jywarren ! Ich finde alle Ideen richtig gut. Sogar ich habe das Problem in Punkt 5 erwähnt. Um es zu lösen, dachte ich daran, die Blase proportional zur Anzahl der Tags in diesem Intervall zu vergrößern.

Ich denke jedoch, dass dies das Problem besser lösen würde:
Wir könnten ein paar Tags neben den Kreisen anzeigen (die in absteigender Reihenfolge ihrer Größe auf der Seite angezeigt werden), sagen Sie 3 davon und klicken Sie dann auf die Blase, um alle Tags anzuzeigen. Auf diese Weise könnten wir die Seite überfliegen und die Informationen intakt halten.

Wie klingt das?

großartig, sollen wir vor der Implementierung noch ein Mockup machen? hast du eine idee
wie Sie dies implementieren möchten, z. B. könnten wir Kreise mit CSS erstellen
border-radius, oder könnten wir vielleicht p5js verwenden? Ich denke, dass das Laden von
die JSON-Adresse mit etwas wie
$.json('/stats/subscriptions.json').onComplete(function(response) { ... });
wäre gut. Es würde einige kleine Änderungen am Statistik-Controller erfordern.

Am Freitag, 8. Februar 2019 um 12:54 Uhr schrieb Isha Gupta [email protected] :

Vielen Dank @jywarren https://github.com/jywarren ! Ich denke alle
Ideen sind wirklich gut. Sogar ich war über die Erwähnung des Problems in Punkt 5.
Um es zu lösen, dachte ich daran, die Blase proportional zu vergrößern
Anzahl der Tags in diesem Intervall.

Ich denke jedoch, dass dies das Problem besser lösen würde:
Wir könnten ein paar Tags neben den Kreisen anzeigen (die in absteigender Reihenfolge angezeigt werden)
Reihenfolge ihrer Größe, indem Sie die Seite nach unten gehen), sagen Sie 3 von ihnen und dann weiter
Wenn Sie auf die Blase klicken, werden alle Tags angezeigt. Auf diese Weise könnten wir überfliegen
durch die Seite und halten Sie die Informationen intakt.

Wie klingt das?

—
Sie erhalten dies, weil Sie erwähnt wurden.
Antworten Sie direkt auf diese E-Mail und zeigen Sie sie auf GitHub an
https://github.com/publiclab/plots2/issues/4603#issuecomment-461888974 ,
oder den Thread stumm schalten
https://github.com/notifications/unsubscribe-auth/AABfJ15nyiYVcP-FiwUF4vfBccV5SQQfks5vLbmogaJpZM4Z8bqv
.

Sicher, wir könnten noch ein Mockup machen, denke ich! Ich hatte nicht wirklich über die Implementierung nachgedacht, ich dachte an die Verwendung von CSS und normalem JS, aber wenn Sie der Meinung sind, dass p5js gut tun würde, können wir damit fortfahren! Ich denke, wir können die ursprüngliche JSON-Adresse beibehalten und JS verwenden, um diese Seite zu rendern.

Wenn wir grundlegendes JS und CSS verwenden können, versuchen wir es – besser als ein Ganzes einzuschließen
neue Bibliothek. Aber wenn Sie daran interessiert sind, p5js auszuprobieren, könnten wir das tun
da ist auch was...!

Am Freitag, 8. Februar 2019 um 13:18 Uhr schrieb Isha Gupta [email protected] :

Sicher, wir könnten noch ein Mockup machen, denke ich! Ich hatte nicht wirklich darüber nachgedacht
Beim Implementierungsteil dachte ich daran, CSS und normales JS zu verwenden, aber wenn
Sie denken, p5js würde gut tun, wir können damit umgehen! Ich denke, wir können behalten
die ursprüngliche JSON-Adresse und verwenden Sie JS, um diese Seite zu rendern.

—
Sie erhalten dies, weil Sie erwähnt wurden.
Antworten Sie direkt auf diese E-Mail und zeigen Sie sie auf GitHub an
https://github.com/publiclab/plots2/issues/4603#issuecomment-461895999 ,
oder den Thread stumm schalten
https://github.com/notifications/unsubscribe-auth/AABfJ1K0MU_eBZJN35QyqnxC7EsI4kaBks5vLb8-gaJpZM4Z8bqv
.

Ja, ich denke, wir könnten beide erkunden und sehen, welche sowohl für die Anzeige als auch für die Site besser ist! Ich würde mit einem besseren Tempo anfangen, daran zu arbeiten, sobald ich meine Prüfungen zur Mitte des Semesters hinter mir habe! Danke vielmals!

Viel Glück bei Deinen Prüfungen!!

Am Freitag, 8. Februar 2019 um 13:32 Uhr schrieb Isha Gupta [email protected] :

Ja, ich denke, wir könnten beide erkunden und sehen, welche besser für die ist
Anzeige sowie die Website! Ich würde mit einem besseren Tempo anfangen, daran zu arbeiten
sobald ich meine Prüfungen zur Mitte des Semesters hinter mir habe! Danke vielmals!

—
Sie erhalten dies, weil Sie erwähnt wurden.
Antworten Sie direkt auf diese E-Mail und zeigen Sie sie auf GitHub an
https://github.com/publiclab/plots2/issues/4603#issuecomment-461900313 ,
oder den Thread stumm schalten
https://github.com/notifications/unsubscribe-auth/AABfJ-_qLbiGiTWACqsQ6EFlf3DD2OCyks5vLcKWgaJpZM4Z8bqv
.

Hier das aktualisierte Design:

Beim Klicken auf die Blase (Wir könnten sie proportional zur Anzahl der Tags erweitern)

Lass mich wissen, wie das aussieht!

Hallo @IshaGupta18 , wie kommt das

Hey, @cesswairimu eigentlich habe ich nicht bewusst mit der Arbeit begonnen, weil ich darauf gewartet habe, dass @jywarren das endgültige Design genehmigt. Im Moment habe ich einige wichtige Prüfungen im College, also werde ich, sobald diese Idee vollständig genehmigt und diese Prüfungen abgeschlossen sind, mit meiner Arbeit beginnen. Es tut mir so leid für diese Verzögerung, ich hatte es nicht beabsichtigt.

Keine Sorge @IshaGupta18 , alles Gute für deine Prüfungen. Vielen Dank

Das ist superschön! Ich denke, wir können das in Stücken umsetzen. Wir könnten mit einem statischen Design beginnen, indem wir alle Tags und die Anzahl der Abonnenten in der rechten Liste auflisten, und später an den interaktiven Teilen arbeiten! Wie klingt das, es in kleinere Stücke zu zerlegen, um es einzeln zu machen?

Hoffe deine Prüfungen laufen gut Isha!

Ja das wäre toll! Wir könnten mit kleinen PRs beginnen und mit dem beginnen
eine, die Sie vorgeschlagen haben! Danke vielmals!

Am Mi, 6. März 2019, 03:24 Jeffrey Warren [email protected]
schrieb:

Das ist superschön! Ich denke, wir können das in Stücken umsetzen. Wir könnten
Beginnen Sie mit einem statischen Design, listen Sie einfach alle Tags und die Anzahl der auf
Abonnenten in der rechten Liste und später am interaktiven arbeiten
Teile! Wie hört sich das an, es in kleinere Stücke zu zerlegen, um eines nach dem anderen zu machen?
einer?

Hoffe deine Prüfungen laufen gut Isha!

—
Sie erhalten dies, weil Sie erwähnt wurden.
Antworten Sie direkt auf diese E-Mail und zeigen Sie sie auf GitHub an
https://github.com/publiclab/plots2/issues/4603#issuecomment-469873165 ,
oder den Thread stumm schalten
https://github.com/notifications/unsubscribe-auth/Am54Z8i6cuukmNb_5zNrAfwJXj4Jskesks5vTueogaJpZM4Z8bqv
.

@gettyorawo könnten Sie daran interessiert sein, daran zu arbeiten? Du könntest eine PR für static design just listing all tags and the number of subscribers in the right-hand list auf /stats/subscriptions

Hey @cesswairimu Es tut mir so leid für meine Inaktivität in diesem @GettyOrawo könnte bei Interesse mit einer kleinen PR beginnen und dann könnte ich vielleicht die interaktiven Teile übernehmen? So können wir effizienter arbeiten. Ich bin auf jeden Fall hier um zu helfen! Danke vielmals!

Hey @cesswairimu und @IshaGupta18 sicher werde ich das

@GettyOrawo lass es mich wissen, wenn du Hilfe brauchst! Sie könnten es tatsächlich in noch kleinere PRs unterteilen, wie zum Beispiel die Logik zum Einbringen von Tags in jedes Intervall und dann einen weiteren PR zum Anzeigen schreiben. Auf diese Weise wird es für uns einfacher zu überprüfen. Was denken Sie?

Keine Sorge @IshaGupta18 ja, die interaktiven Teile

Vielen Dank @IshaGupta18 Ich werde mich weiterkomme

Und gute Arbeit an den Designs. Sie sind großartig!

Hey @IshaGupta18 und @cesswairimu, nur um Sie auf dem

Hey @GettyOrawo Ich glaube, du musst das nicht tun. Was Sie wahrscheinlich tun würden, ist diese Zeile https://github.com/publiclab/plots2/blob/master/app/controllers/stats_controller.rb#L8 zu entfernen, damit Sie definieren können, wie Daten angezeigt werden. Die Vorlage ist hier bereits erstellt https://github.com/publiclab/plots2/blob/master/app/views/stats/subscriptions.html.erb. @tags ist ein Hash von Schlüsselpaaren mit tag name und dem Wert subscriptions count . Für den Anfang möchten wir dies in einer einfachen Liste anzeigen, vielleicht ähnlich wie https://publiclab.org/tags, aber jetzt mit den ersten beiden Elementen dieser Liste. Vielen Dank

Okay, das macht absolut Sinn. Danke @cesswairimu

Es tut mir leid, dass ich das verpasst habe. Ja, ich glaube, das muss getan werden.
Versuche es am Anfang super einfach zu halten, nur ein paar Tag-Namen auf
eine Seite der Seite! Danke vielmals!

Am Freitag, 15. März 2019, 18:50 Uhr schrieb GettyOrawo [email protected] :

Okay, das macht absolut Sinn. Danke @cesswairimu
https://github.com/cesswairimu

—
Sie erhalten dies, weil Sie erwähnt wurden.
Antworten Sie direkt auf diese E-Mail und zeigen Sie sie auf GitHub an
https://github.com/publiclab/plots2/issues/4603#issuecomment-473283169 ,
oder den Thread stumm schalten
https://github.com/notifications/unsubscribe-auth/Am54ZyexnFJY3eTE9mj-9ZxHxlpPeD67ks5vW540gaJpZM4Z8bqv
.

Hey @GettyOrawo ! Wie läuft die Arbeit in diesem Fall, einfach einchecken, um zu sehen, ob Sie Hilfe benötigen!

Hey @IshaGupta18 Ich habe gerade eine Start-PR erstellt. Ich konnte die Statistiken in einer einfachen Tabelle gruppieren. Ich habe nur hartcodierte Werte in den leeren
Als nächstes muss ich Tests für dasselbe schreiben, um sicherzustellen, dass es für alle funktioniert.

Entschuldigung @GettyOrawo, ich habe dir nicht genug Anweisungen gegeben, da dies dein erstes Problem ist. Poste hier ein paar Hinweise. Habe gerade deine Pull-Anfrage gesehen..also kommt @tags im Statistik-Controller als Hash, so dass dies nicht nötig ist. <strong i="7">@tags</strong> = @tags.group_by{|k,v| v}.map{|k,v| {k => v.map{|x| x.join("-")}}} Was wir hier tun könnten, ist einfach diese Zeile https://github.com/publiclab/plots2/blob/master/app/controllers/stats_controller.rb#L8 zu entfernen
Dann gibt es diese tolle Tabellenklasse, mit der Sie table inline-grid zum Stylen der Tabelle verwenden können. Die Ansicht könnte also diesen Code haben

<br>
    <table class="table inline-grid">
        <tr>
            <th> Tag </th>
            <th> Number of Subscribers </th>
        </tr>
        <% @tags.each do |tag, tag_count| %>
            <tr>
                <td> <%= tag %> </td>
                <td> <%= tag_count %></td>
            </tr>
        <% end %>
    </table>

Dann sollten wir wohl gut sein

Zum Testen haben wir Daten für einige Tags gesetzt, zB alles, Blog, Test... Sie könnten einen Benutzer einige dieser Tags abonnieren lassen und Sie sollten einige Daten zu /stats/subscriptions . Benutzernamen sind Admin, Moderator und Benutzer. alle Passwörter sind password .
Wenn das zum Testen nicht ausreicht, können Sie Ihren Zweig mit diesem Befehl git push -f https://github.com/publiclab/plots2.git HEAD:unstable auf Unstable pushen. Erwähnen Sie nur, dass Sie auf dem gitter-Kanal auf Unstable pushen, um andere beim Testen nicht zu stören. Der Code sollte nach etwa 20 Minuten hier http://unstable.publiclab.org/ verfügbar sein.
Fühlen Sie sich frei, unten zu kommentieren, falls Sie Fragen haben
Vielen Dank

Oh ja, macht absolut Sinn.
Dieser Code zeigt Namen mit ihren Abonnementnummern an.

<br>
    <table class="table inline-grid">
        <tr>
            <th> Tag </th>
            <th> Number of Subscribers </th>
        </tr>
        <% @tags.each do |tag, tag_count| %>
            <tr>
                <td> <%= tag %> </td>
                <td> <%= tag_count %></td>
            </tr>
        <% end %>
    </table>

mögen:

Obwohl für den sehr hässlichen Code auf dem Controller:
<strong i="42">@tags</strong> = @tags.group_by{|k,v| v}.map{|k,v| {k => v.map{|x| x.join("-")}}}

Ich habe versucht, die Statistiken in ihre gemeinsamen Abonnementnummern zu gruppieren, zum Beispiel sind Statistiken mit 1 ["amanda-1", "grace-1"] Statistiken mit 43 sind ["cess-43", "isha-43" ], damit alle Statistiken mit gemeinsamen Abonnementnummern zusammen sind. Es muss jedoch viel umgestaltet werden: So habe ich über die Ausgabe nachgedacht;

Anfänglich ist @tags ein Hash mit Schlüsseln als Tags und Werten als Anzahl der Abonnements dieses Tags.
Meine Frage: Brauche ich diesen Code in meiner Ansicht eingebettet oder sollte er in der Controller-Aktion enthalten sein, damit ich sie auf diese Weise sortieren kann?

Aha toll! Ich sehe, dein Display sieht so viel besser aus :balloon: . Wir können später umgestalten. Vielen Dank

Erstaunliche Arbeit hier @GettyOrawo ! Fühlen Sie sich frei, um Hilfe zu bitten! @cesswairimu Sobald dies erledigt ist, werden wir Gruppen wie Klassenintervalle

Okay, danke Leute, ich werde über den Fortschritt berichten.

Hey @cesswairimu , @IshaGupta18 und @jywarren Ich habe meine Position mit diesem Problem im Pull-Request unten angegeben, da ich mir Sorgen mache, dass ich es ewig in Anspruch nehmen könnte:

https://github.com/publiclab/plots2/pull/5224

Ich finde es ein wenig zeitaufwändig zu lernen, wie man die Statistiken wie im Mockup angegeben anzeigt. Ich habe Artikel und Tutorials zu p2.js und matter.js gelesen. Es ist tatsächlich machbar, aber es wird viel länger dauern, als ich angenommen habe. Ist es möglich, dies einzufügen und dann kann ich in Zukunft das Display besser gestalten.

Es ist ein wenig überwältigend, da ich Schwierigkeiten habe, die Bewerbungsfrist von Outreachy einzuhalten, aber dies ist meine erste Ausgabe. Was halten Sie davon?

Das habe ich bisher:

Hey @GettyOrawo, es sieht toll aus und ja, wir können es später verfeinern ... Wenn Sie nur die Codeclimate-Probleme beheben könnten, sollten wir gut sein. Vielen Dank, dass Sie daran gearbeitet haben.

Ja absolut, das ist eine tolle Arbeit! Und mach dir darüber nicht zu viele Sorgen
Konzentrieren Sie sich jetzt auf Ihre Bewerbung, das ist wirklich gut genug! Danke vielmals!

Am Do, 21. März 2019, 21:05 Uhr Cess [email protected] schrieb:

Hey @GettyOrawo https://github.com/GettyOrawo sieht toll aus und
Ja, sicher können wir später verfeinern ... Wenn Sie nur das Codeklima reparieren könnten
Themen sollten wir gut sein. Vielen Dank, dass Sie daran gearbeitet haben.

—
Sie erhalten dies, weil Sie erwähnt wurden.
Antworten Sie direkt auf diese E-Mail und zeigen Sie sie auf GitHub an
https://github.com/publiclab/plots2/issues/4603#issuecomment-475279958 ,
oder den Thread stumm schalten
https://github.com/notifications/unsubscribe-auth/Am54Zw8RlXPdFHli6JdffNyk2CjxyeWNks5vY6aygaJpZM4Z8bqv
.

Super Vielen Dank. Lassen Sie mich das beheben.

Okay, alle Tests bestehen jetzt ok. :leicht_smiling_face:

@cesswairimu und @IshaGupta18 kann ich ein weiteres Problem bearbeiten? Oder sollte ich nach einem Fehler suchen, um ihn zu beheben und ein Problem zu erstellen?

Dies ist eine EPISCHE erste PR! Beeindruckend!!! Herzlichen Glückwunsch, und ja, wir unterstützen immer ein erstes einfaches Projekt und bauen Komplexität in Folge-PRs auf! Wow, lassen Sie mich jetzt überprüfen. Dankeschön!!!! und fantastische Arbeit an alle!

Danke @jywarren ! :Lächeln:

Hey @jywarren @cesswairimu, es gibt noch Arbeit, um die interaktiven Blasen zu machen. Dem würde ich bald nachgehen. Wir können die Arbeit auch in der Folgeausgabe fortsetzen, aber wir sollten diese noch eine Weile offen halten, denke ich. Was denkt ihr? Vielen Dank und tolle Arbeit @GettyOrawo !

Ja, großartig! Danke @IshaGupta18!!!

Am Mo, 25. März 2019 um 15:55 Uhr schrieb Isha Gupta [email protected] :

Hey @jywarren https://github.com/jywarren @cesswairimu
https://github.com/cesswairimu es gibt noch Arbeit in diesem zu
Machen Sie die interaktiven Blasen. Dem würde ich bald nachgehen. Wir können
auch in der Folgeausgabe weiterarbeiten, aber das sollten wir behalten
Ich denke, einer ist seit einiger Zeit geöffnet. Was denkt ihr? Vielen Dank und
tolle Arbeit @GettyOrawo https://github.com/GettyOrawo !

—
Sie erhalten dies, weil Sie erwähnt wurden.
Antworten Sie direkt auf diese E-Mail und zeigen Sie sie auf GitHub an
https://github.com/publiclab/plots2/issues/4603#issuecomment-476352685 ,
oder den Thread stumm schalten
https://github.com/notifications/unsubscribe-auth/AABfJ9Vf5E1FxwrysJH1AKDsjnUgsGBcks5vaSmOgaJpZM4Z8bqv
.

Zum Abschluss ... wir sind bei einer besseren Anzeige und auch hier läuft die gleiche Diskussion https://github.com/publiclab/plots2/issues/5260. Danke an alle