Hello again, does anyone have experience with Sankey diagrams / the Google Web Designer and has an answer to my question posted below?
Thanks a lot! Best lovis Am Mittwoch, 23. August 2017 09:40:29 UTC-4 schrieb Lovis Maria: > > Dear Google users, > > I was searching for a good software to visualize sankey diagrams and did > not find any, until I got to know the Google Web Designer. This is really a > great tool to design sankey diagrams. > > However, I encountered one problem and could not figure out a solution yet > (e.g., by consulting this page > https://developers.google.com/chart/interactive/docs/gallery/sankey#controlling-colors > > or browsing through the group here). > I have a sankey diagram with 10 nodes (5 on the right, 5 left) and various > links between them; code provided below. However, I am only substantially > interested in four of the flows/links: > *[ 'Yes', 'Like', 273 ],* > *[ 'Yes', 'Dislike', 310 ],* > *[ 'Rather yes', 'Like', 306 ],* > *[ 'Rather yes', 'Dislike', 317 ]* > > All other flows are of secondary interest. Therefore, I would like to use > the *colorMode: 'gradient'* only for these four links, while all the > remaining links should be gray (or, alternatively, "transparent", if such > an option exist, or just not as much in the foreground). The link weights > should remain the same. > > I would be extremely happy if anybody had a solution for me :-) > > Best > Lovis > > > <html> > <head> > <script type="text/javascript" src=" > https://www.gstatic.com/charts/loader.js";></script> > <script type="text/javascript"> > google.charts.load('current', {'packages':['sankey']}); > google.charts.setOnLoadCallback(drawChart); > > function drawChart() { > var data = new google.visualization.DataTable(); > data.addColumn('string', 'From'); > data.addColumn('string', 'To'); > data.addColumn('number', 'Weight'); > data.addRows([ > [ 'Yes', 'Like', 273 ], > [ 'Yes', 'Dislike', 310 ], > [ 'Yes', 'Abstention', 38 ], > [ 'Yes', 'no answer', 4 ], > [ 'Yes', 'died', 75 ], > [ 'Rather yes', 'Like', 306 ], > [ 'Rather yes', 'Dislike', 317 ], > [ 'Rather yes', 'Abstention', 40 ], > [ 'Rather yes', 'no answer', 4 ], > [ 'Rather yes', 'died', 57 ], > [ 'Undecided', 'Like', 3 ], > [ 'Undecided', 'Dislike', 9 ], > [ 'Undecided', 'Abstention', 7 ], > [ 'Undecided', 'died', 12 ], > [ 'Rather no', 'Like', 13 ], > [ 'Rather no', 'Dislike', 171 ], > [ 'Rather no', 'Abstention', 24 ], > [ 'Rather no', 'no answer', 2 ], > [ 'Rather no', 'died', 28 ], > [ 'No', 'Like', 10 ], > [ 'No', 'Dislike', 153 ], > [ 'No', 'Abstention', 9 ], > [ 'No', 'no answer', 0 ], > [ 'No', 'died', 30 ], > > ]); > > // Sets chart options. > > var colors = ['#00c92c', '#00c92c', '#ff0000', '#28a9ff', > '#f917c0','#3725d1', '#00ff37', '#f2ff00', '#ff6600', '#ff0000', > ]; > > var options = { > height: 400, > width: 800, > sankey: { > iterations: 0, > node: { width: 30 , > label: { > fontName: 'Calibri', > fontSize: 24, > color: '#000', > bold: true, > italic: false > }, > colors: colors > }, > link: { > colorMode: 'gradient', > colors: colors > } > } > }; > > // Instantiates and draws our chart, passing in some options. > var chart = new > google.visualization.Sankey(document.getElementById('sankey_basic')); > chart.draw(data, options); > } > </script> > </head> > <body> > <div id="sankey_basic" style="width: 900px; height: 500px;"></div> > </body> > </html> > > -- 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 https://groups.google.com/group/google-visualization-api. To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/c148e43f-fdd7-4947-984c-497cfe1de43b%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
