Last active
February 13, 2017 22:10
-
-
Save wrtsprt/b5a1be66219443c8b21f96d159c1d87d to your computer and use it in GitHub Desktop.
IMDB ratings plotting
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.bundle.js"></script> | |
| <script type="text/javascript"> | |
| var realData = [{y: 3.7, x: 2016}, | |
| ,{y: 3.9, x: 2016} | |
| ,{y: 3.2, x: 2016} | |
| ,{y: 3.4, x: 2016} | |
| ,{y: 4.2, x: 2016} | |
| ,{y: 3.3, x: 2016} | |
| ,{y: 3.8, x: 2016} | |
| ,{y: 4.5, x: 2015} | |
| ,{y: 4.7, x: 2014} | |
| ,{y: 4.6, x: 2013} | |
| ,{y: 4.9, x: 2012} | |
| ,{y: 4.8, x: 2010} | |
| ,{y: 4.5, x: 2010} | |
| ,{y: 5.1, x: 2009} | |
| ,{y: 5.2, x: 2009} | |
| ,{y: 5.2, x: 2009} | |
| ,{y: 3.2, x: 2009} | |
| ,{y: 4, x: 2008} | |
| ,{y: 5.4, x: 2008} | |
| ,{y: 5.4, x: 2007} | |
| ,{y: 3.5, x: 2007} | |
| ,{y: 2.7, x: 2006} | |
| ,{y: 4.1, x: 2006} | |
| ,{y: 4.2, x: 2006} | |
| ,{y: 3.9, x: 2005} | |
| ,{y: 5.5, x: 2005} | |
| ,{y: 4.2, x: 2005} | |
| ,{y: 3.8, x: 2005} | |
| ,{y: 4.4, x: 2005} | |
| ,{y: 3.9, x: 2004} | |
| ,{y: 4.7, x: 2003} | |
| ,{y: 3.3, x: 2003} | |
| ,{y: 3.3, x: 2003} | |
| ,{y: 4.6, x: 2002} | |
| ,{y: 5.8, x: 2001} | |
| ,{y: 5.3, x: 2000} | |
| ,{y: 5.2, x: 1998} | |
| ,{y: 4.1, x: 1998} | |
| ,{y: 5, x: 1997} | |
| ,{y: 5.3, x: 1996} | |
| ,{y: 5.4, x: 1995} | |
| ,{y: 4.4, x: 1994} | |
| ,{y: 6.4, x: 1992} | |
| ,{y: 6, x: 1991} | |
| ,{y: 5.9, x: 1990} | |
| ,{y: 5.9, x: 1988}]; | |
| var labels = [ | |
| 2016, | |
| , 2016 | |
| , 2016 | |
| , 2016 | |
| , 2016 | |
| , 2016 | |
| , 2016 | |
| , 2015 | |
| , 2014 | |
| , 2013 | |
| , 2012 | |
| , 2010 | |
| , 2010 | |
| , 2009 | |
| , 2009 | |
| , 2009 | |
| , 2009 | |
| ,2008 | |
| ,2008 | |
| ,2007 | |
| ,2007 | |
| ,2006 | |
| ,2006 | |
| ,2006 | |
| ,2005 | |
| ,2005 | |
| ,2005 | |
| ,2005 | |
| ,2005 | |
| ,2004 | |
| ,2003 | |
| ,2003 | |
| ,2003 | |
| ,2002 | |
| ,2001 | |
| ,2000 | |
| ,1998 | |
| ,1998 | |
| ,1997 | |
| ,1996 | |
| ,1995 | |
| ,1994 | |
| ,1992 | |
| ,1991 | |
| ,1990 | |
| ,1988]; | |
| var values = [ | |
| 3.7, | |
| ,3.9 | |
| ,3.2 | |
| ,3.4 | |
| ,4.2 | |
| ,3.3 | |
| ,3.8 | |
| ,4.5 | |
| ,4.7 | |
| ,4.6 | |
| ,4.9 | |
| ,4.8 | |
| ,4.5 | |
| ,5.1 | |
| ,5.2 | |
| ,5.2 | |
| ,3.2 | |
| ,4, | |
| ,5.4 | |
| ,5.4 | |
| ,3.5 | |
| ,2.7 | |
| ,4.1 | |
| ,4.2 | |
| ,3.9 | |
| ,5.5 | |
| ,4.2 | |
| ,3.8 | |
| ,4.4 | |
| ,3.9 | |
| ,4.7 | |
| ,3.3 | |
| ,3.3 | |
| ,4.6 | |
| ,5.8 | |
| ,5.3 | |
| ,5.2 | |
| ,4.1 | |
| ,5, | |
| ,5.3 | |
| ,5.4 | |
| ,4.4 | |
| ,6.4 | |
| ,6, | |
| ,5.9 | |
| ,5.9]; | |
| $( document ).ready(function() { | |
| console.log('ready'); | |
| plotGraph(); | |
| }); | |
| var theData; | |
| var movieMap = {}; | |
| var storeData = function() { | |
| $.when(getData()).then(function(theDataWeGot) { | |
| console.dir(theDataWeGot); | |
| theData = theDataWeGot.data; | |
| }); | |
| }; | |
| var getData = function() { | |
| var make = $.Deferred(); | |
| var imdbId = 'nm0000219'; | |
| $.ajax({ | |
| url: 'http://imdb.wemakesites.net/api/' + imdbId, | |
| crossDomain: true, | |
| data: { | |
| api_key: 'f944db93-6274-4955-a630-6e61f11c89c8' | |
| }, | |
| dataType: 'jsonp' | |
| }).done(function(data) { | |
| console.log(data); | |
| make.resolve(data); | |
| }); | |
| return make.promise(); | |
| }; | |
| var retrieveRating = function() { | |
| $.each(theData.filmography, function(index, item){ | |
| console.log(item); | |
| var movieId = /http:\/\/www\.imdb\.com\/title\/(.*)\//.exec(item.info)[1] | |
| console.log("id: " + movieId); | |
| movieMap[movieId] = { info: item.info, title: item.title, year: item.year } | |
| $.ajax({ | |
| url: 'http://app.imdb.com/title/maindetails?tconst=' + movieId | |
| }).done(function(movie) { | |
| if(movie.data && movie.data.rating) { | |
| var movieInfo = movieMap[movie.data.tconst]; | |
| movieInfo["rating"] = movie.data.rating; | |
| movieMap[movie.data.tconst] = movieInfo; | |
| } | |
| }); | |
| }); | |
| }; | |
| var plotData = new Array(); | |
| var prepareData = function() { | |
| $.each(movieMap, function(id, movieDetails) { | |
| year = parseInt(/ (\d*)/.exec(movieDetails.year)[1]) | |
| if(movieDetails.rating && year) { | |
| plotData.push({y: movieDetails.rating, x: year }); | |
| } | |
| }); | |
| }; | |
| var plotGraph = function() { | |
| var ctx = document.getElementById("myChart"); | |
| var myChart = new Chart(ctx, { | |
| type: 'line', | |
| data: { | |
| labels: labels.reverse(), | |
| datasets: [ | |
| { | |
| data: values.reverse(), | |
| label: 'the real data' , | |
| spanGaps: true, | |
| cubicInterpolationMode: 'monotone' | |
| } | |
| ], | |
| options: { | |
| scales: { | |
| yAxes: [{ | |
| ticks: { | |
| beginAtZero:true | |
| } | |
| }], | |
| xAxes: [{ | |
| type: 'linear', | |
| position: 'bottom' | |
| }] | |
| } | |
| } | |
| }}); | |
| } | |
| var main = function() { | |
| $.when(storeData()) | |
| .then(retrieveRating()) | |
| .then(prepareData()) | |
| .then(plotGraph()); | |
| }; | |
| </script> | |
| </head> | |
| <body> | |
| <h2>Hello Steven</h2> | |
| <canvas id="myChart" width="400" height="400"></canvas> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment