D3 Examples - sentimentVis with transcript from datastories attempt1

sentimentVis with transcript from datastories attempt1

Basically I am trying to visualise what is going on in a Datastories podcast (transcript from http://datastori.es/transcripts/) I parsed the text with Python using Textblob for sentiment analysis and sentence identification

This is attempt number one-- in part to learn d3v4 as well. At the moment, I am only visualising the speech of one person (enrico)

Plan is to be able to toggle between different speakers and show all the show together.

xxxxxxxxxx
 
<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <script src="https://d3js.org/d3.v4.min.js"></script>
    <script src="https://d3js.org/d3-scale-chromatic.v1.min.js"></script>
    <link rel="stylesheet" href="simplegrid.css" type="text/css">
    <style>
        body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
        .speech {
            font-size: 6px;
        }
        #textContainer {
            overflow: scroll;
            height: 100vh;
        }
        .display-text {
            font-size: 12px;
            font-weight: bold;
        }
    </style>
</head>
​
<body>
​
<div class="grid">
    <div class="col-1-1"><h2>Experiment in visualising the sentiment of a transcript from datastories podcast (#77)</h2></div>
    <div class="col-2-3">
        <div id="vis" class="col-1-1"></div>
​
        <div id="legendTitle" class="col-1-1">Subjectivity</div>
        <div id="legend" class="col-1-1"></div>
        <div id="mouseover-text" class="col-1-1"></div>
    </div>
    <div class="col-1-3" id="textContainer"></div>
</div>
<script src="sentiment.js"></script>
</body>
    