javascript - Display Half Portion of Google Charts -


i using following code display chart. size of chart 500x500. want display half portion of chart. 500x250. when change values in div, instead of showing half resizing whole chart.

what need hide area shows 'yellow', (i don't want make transparent) enter image description here

<!doctype html> <html lang="en"> <head>     <meta charset="utf-8" />     <meta http-equiv="x-ua-compatible" content="ie=edge,chrome=1">      <meta name="viewport" content="width=device-width, initial-scale=1.0">      <title>website code analyzer</title>     <link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>     <script src="js/boostrap.js"></script>     <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 data = google.visualization.arraytodatatable([           ['pac man', 'percentage'],           ['analyzer score', 75],           ['', 25],           ['', 100]         ]);          var options = {           piehole: 0.5,           tooltip: {text: 'value'},           title: 'my daily activities',           legend: 'none',           width: 500,           pieslicetext: 'none',           piestartangle: 270,           slices: {             0: { color: '#3366cc' },             1: { color: '#eae8e8'},             2: { color: 'yellow'}           }         };          var chart = new google.visualization.piechart(document.getelementbyid('pacman'));         chart.draw(data, options);       }     </script> </head> <body>     <div class="container-fluid">         <div class="row">             <div class="col-md-6">                 <div id="pacman" style="width: 500px; height: 500px;"></div>             </div>         </div>     </div> </body> </html> 

thank guys, got answer myself

<div style="max-height:250px;overflow:hidden">     <div id="pacman" style="width: 500px; height: 500px;"></div> </div> 

Comments

Popular posts from this blog

Delphi XE2 Indy10 udp client-server interchange using SendBuffer-ReceiveBuffer -

Qt ActiveX WMI QAxBase::dynamicCallHelper: ItemIndex(int): No such property in -

python - cx_oracle unable to find Oracle Client -