Well that looks easy enough if it's static data, but I can't imagine it is static data that's been manually inputted. The real question I'm asking would be how did they locate and then auto-populate those "social mention" metrics into the Annotation Chart? I'm sure they are not manually adding the mention data for every article they post. Any clue how they might be finding this data and then automating the charting of it? I can't seem to find any clues in their page source, unless I'm missing something.
On Friday, September 12, 2014 5:07:56 PM UTC-4, Daniel LaLiberte wrote: > > It looks like this is the code they used: > > <script type="text/javascript" src="http://www.google.com/jsapi"></script> > <script type="text/javascript"> > google.load('visualization', '1.1', > {'packages':['annotationchart']}); > google.setOnLoadCallback(drawChart); > function drawChart() { > var data = new google.visualization.DataTable(); > data.addColumn('datetime', 'Date'); > data.addColumn('number', 'Total Shares'); > data.addColumn('string', 'Kepler title'); > data.addColumn('string', 'Kepler text'); > data.addRows([ > [new Date(2014, 8, 12, 13, 01), 2834, 'Total Mentions: 2,834', > '<br/>Facebook Shares: 773<br/>Facebook Likes: 975<br/>Twitter: > 1,042<br/>Pinterest: 2<br/>Google: 42<br/>'],[new Date(2014, 8, 12, 13, > 17), 2834, 'Total Mentions: 2,834', '<br/>Facebook Shares: 773<br/>Facebook > Likes: 975<br/>Twitter: 1,042<br/>Pinterest: 2<br/>Google: 42<br/>'],[new > Date(2014, 8, 12, 13, 33), 2959, 'Total Mentions: 2,959', '<br/>Facebook > Shares: 773<br/>Facebook Likes: 1,044<br/>Twitter: 1,091<br/>Pinterest: > 3<br/>Google: 48<br/>'],[new Date(2014, 8, 12, 14, 04), 2988, 'Total > Mentions: 2,988', '<br/>Facebook Shares: 773<br/>Facebook Likes: > 1,059<br/>Twitter: 1,102<br/>Pinterest: 3<br/>Google: 51<br/>'],[new > Date(2014, 8, 12, 14, 35), 3015, 'Total Mentions: 3,015', '<br/>Facebook > Shares: 773<br/>Facebook Likes: 1,077<br/>Twitter: 1,111<br/>Pinterest: > 3<br/>Google: 51<br/>'],[new Date(2014, 8, 12, 15, 35), 3095, 'Total > Mentions: 3,095', '<br/>Facebook Shares: 773<br/>Facebook Likes: > 1,135<br/>Twitter: 1,133<br/>Pinterest: 3<br/>Google: 51<br/>'],[new > Date(2014, 8, 12, 16, 36), 3189, 'Total Mentions: 3,189', '<br/>Facebook > Shares: 773<br/>Facebook Likes: 1,208<br/>Twitter: 1,154<br/>Pinterest: > 3<br/>Google: 51<br/>'], > ]); > var chart = new > google.visualization.AnnotationChart(document.getElementById('chart_div')); > var options = { > displayAnnotations: true, > allowHtml: true, > }; > chart.draw(data, options); > } > </script> > > On Fri, Sep 12, 2014 at 4:46 PM, Cycles Guy <[email protected] > <javascript:>> wrote: > >> Thank you Daniel. >> >> Glad to see it's already a template for the most part. Now I just have to >> figure out how they're formatting the data so I can do something similar. >> Any suggestions on how to figure out what they're doing? Is it something I >> can tell by looking at their page code? >> >> On Friday, September 12, 2014 3:53:49 PM UTC-4, Daniel LaLiberte wrote: >>> >>> That's an AnnotationChart, which is a built-in chart type. The docs are >>> here: https://developers.google.com/chart/interactive/ >>> docs/gallery/annotationchart >>> >>> >>> On Fri, Sep 12, 2014 at 3:43 PM, Cycles Guy <[email protected]> wrote: >>> >>>> I'd like to add a chart like this social mentions one to my blog: >>>> http://www.viralnews365.com/article/Scottish-referendum- >>>> too-close-to-call-says-ICM-poll-1410540303.html >>>> >>>> Is there a pre-made widget I can use, or will this require >>>> custom-coding from scratch? If the latter, where would I start or who >>>> could >>>> I hire to create this? >>>> >>>> -- >>>> >>>> >>> >>> >>> -- >>> Daniel LaLiberte <https://plus.google.com/100631381223468223275?prsrc=2> >>> - 978-394-1058 >>> [email protected] 5CC, Cambridge MA >>> [email protected] 9 Juniper Ridge Road, Acton MA >>> >> -- >> >> > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/d/optout.
