gedankenstuecke/twitter-analyser

{% extends 'tweet_display/application.html' %}

{% block content %}

{% if oh_id == current_user_oh_id %}

{% include 'tweet_display/partials/graph_status.html' %}

{%endif%}

<div class="row">
  <div class="col-md-8">
    {%if 'top_replies' in graphs%}
    <div class='top_replies'></div>
    {%else%}
    {% include 'tweet_display/partials/graph_in_making.html' %}
    {%endif%}
  </div>
  <div class="col-md-4">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h3 class="panel-title">The most interactions</h3>
      </div>
      <div class="panel-body">
        <p>
          Replying to someone's tweets is the main way of interacting on Twitter.
          The people we interact with can stay the same over large spans of time,
          or they can change - reflecting different social networks and circles of
          friends we move in.
        </p>
        <p>
          The graph here shows you the <i>Top Five</i> people you have replied to
          most, summed up for your total time on Twitter. To make the graph less
          prone to noise the replies for each user are not given per day but are
          summed up per quarter.
        </p>
        <p>
          The <code>x-axis</code> thus lists individual
          quarters since the sign-up to Twitter. The <code>y-axis</code> gives the
          sum of replies for the individual users per quarter. The <i>Top Five</i>
          people you replied to are color-coded and are also listed on the graph
          when hovering over a given data point.
        </p>
      </div>
    </div>
  </div>
</div>

<div class="row">
  <div class="col-md-8">
    {%if 'gender_reply' in graphs%}
    <div class='gender_replies'></div>
    {%else%}
    {% include 'tweet_display/partials/graph_in_making.html' %}
    {%endif%}
  </div>
  <div class="col-md-4">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h3 class="panel-title">The gender breakdown for replies</h3>
      </div>
      <div class="panel-body">
        <p>
          Twitter can be a highly gendered experience and there is
          <a href="https://blogs.scientificamerican.com/voices/how-men-can-help-women-in-stem-shut-up-sit-back-and-listen/">
            plenty of research showing that such biases overwhelmingly favor men
          </a>. Other tools, like
          <a href="https://twitterlytic.herokuapp.com/">
            <i>Twitterlytic</i>
          </a> allow you to find out how the gender breakdown is amongst the people
          you follow and the people that follow you. By looking at a whole Twitter
          archive we can have a look into whether interactions - replies and retweets -
          are gender balanced as well.
        </p>
        <p>
          The graph shows you the number of replies to Twitter users
          that are classified as either <code>male</code> or <code>female</code>. The
          classifications are predictions based on users' first names as
          given in their Twitter accounts. The predictions itself are performed by the Python
          package
          <a href="https://github.com/lead-ratings/gender-guesser">
            <code>gender_guesser</code>
          </a>. It uses name/gender-frequencies from a larger text corpus.
          <code>mostly male</code>, <code>mostly female</code>, <code>andy</code>
          and <code>unknown</code> classifications are ignored.
          To decrease the noise the daily values have been averaged by a daily
          average over a 180 day window (<code>dataframe.rolling('180d').mean()</code>).
        </p>
        <p>
          <small>Ideally these graphs would
            <a href="https://emptysqua.re/blog/gender-of-twitter-users-i-follow/">
              include non-binary folks</a>. Doing this is a bit trickier. It is thus a
              <a href="https://github.com/gedankenstuecke/twitter-analyser/issues/20">work in progress</a>.
          </small>
        </p>
      </div>
    </div>
  </div>
</div>

<div class="row">
  <div class="col-md-8">
    {%if 'gender_rt' in graphs%}
    <div class='gender_rt'></div>
    {%else%}
    {% include 'tweet_display/partials/graph_in_making.html' %}
    {%endif%}
  </div>
  <div class="col-md-4">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h3 class="panel-title">The gender breakdown for retweets</h3>
      </div>
      <div class="panel-body">
        <p>
          Even more interesting than whether replying to people might be gendered
          <a href="https://blogs.scientificamerican.com/voices/how-men-can-help-women-in-stem-shut-up-sit-back-and-listen/">
            can be the question which voices are being amplified
          </a>.
          On Twitter a good indicator of amplification are retweets. These can
          be gender balanced or show biases, similarly to the replies to other users.
        </p>
        <p>
          The graph shows you the number of retweets to Twitter users
          that are classified as either <code>male</code> or <code>female</code>. The
          classifications are again predictions made by the Python
          package
          <a href="https://github.com/lead-ratings/gender-guesser">
            <code>gender_guesser</code>
          </a>.
          To decrease the noise the daily values have again been averaged by a daily
          average over a 180 day window (<code>dataframe.rolling('180d').mean()</code>).
        </p>
        <p>
          <small>Ideally these graphs would
            <a href="https://emptysqua.re/blog/gender-of-twitter-users-i-follow/">
              include non-binary folks</a>. Doing this is a bit trickier. It is thus a
              <a href="https://github.com/gedankenstuecke/twitter-analyser/issues/20">work in progress</a>.
          </small>
        </p>
      </div>
    </div>
  </div>
</div>
{% include 'tweet_display/partials/graph_buttons.html' %}

<script>
d3.json('{% url 'gender_rt' oh_id=oh_id %}', function(data) {
   data = MG.convert.date(data, 'date');
   MG.data_graphic({
     title: "retweets & gender",
     description: "Gender distribution amongst retweets",
     data: data,
     width: 600,
     height: 450,
     right: 60,
     full_width: true,
     target: ".gender_rt",
     x_accessor: "date",
     y_accessor: ["male",'female'],
     legend: ["men",'women'],
     aggregate_rollover: true,
   });
});

d3.json('{% url 'gender_reply' oh_id=oh_id %}', function(data) {
   data = MG.convert.date(data, 'date');
   MG.data_graphic({
     title: "replies & gender",
     description: "Gender distribution amongst replies",
     data: data,
     width: 600,
     height: 450,
     right: 60,
     full_width: true,
     target: ".gender_replies",
     x_accessor: "date",
     y_accessor: ["male",'female'],
     legend: ["men",'women'],
     aggregate_rollover: true,
   });
});

d3.json('{% url 'top_replies' oh_id=oh_id %}', function(data) {
   data = MG.convert.date(data, 'date');
   y_keys = Object.keys(data[0]);
   y_keys = y_keys.filter(function(item) {
     return item !== 'date'
   });
   MG.data_graphic({
     title: "top replies",
     description: "To whom did you reply the most? And did this behavior change over time?",
     data: data,
     width: 1200,
     height: 450,
     right: 100,
     bottom: 80,
     full_width: true,
     target: ".top_replies",
     x_accessor: "date",
     y_accessor: y_keys,
     legend: y_keys,
     aggregate_rollover: true,
     interpolate: d3.curveMonotoneX,
   });
});

</script>

{% endblock %}