D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
genesisbertiz
Full window
Github gist
3d Chart
Built with
blockbuilder.org
<!DOCTYPE html> <head> <meta charset="utf-8"> <style> .google-visualization-tooltip { border: solid 1px #bdbdbd; border-radius: 2px; background-color: white; position: absolute; box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.6); font-size: 11px; -moz-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.6); -webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.6); font-family: arial; } .google-visualization-tooltip div { padding:5px; } </style> <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> <script type="text/javascript"> google.charts.load("current", {packages:["corechart"]}); google.charts.setOnLoadCallback(drawChart); function drawChart() { var dataTable = new google.visualization.DataTable(); dataTable.addColumn('string', 'Name'); dataTable.addColumn('number', 'Value'); dataTable.addColumn({type: 'string', role: 'tooltip', 'p': {'html': true}}); dataTable.addRows([ ['Lee System', 70, ''], ['Test Customer 1', 29, ''], ['Others', 1, ''], ]); var options = { title: 'Sales Top List', is3D: true, tooltip: { isHtml: false } }; var chart = new google.visualization.PieChart(document.getElementById('piechart_3d')); chart.draw(dataTable, options); } </script> </head> <body> <div id="piechart_3d" style="width: 900px; height: 500px;"></div> </body>
https://www.gstatic.com/charts/loader.js