Populate (Bind) Google Gauge chart from Database using Google API in ASP.Net

Hi Waghuldey,

Check this example. Now please take its reference and correct your code.

HTML

ContentPage

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
        google.charts.load('current', { 'packages': ['gauge'] });
        google.charts.setOnLoadCallback(drawChart);
        function drawChart() {
            var data = google.visualization.arrayToDataTable([['Target Completed', 85]], true);
            var options = {
                width: 200,
                height: 220,
                redFrom: 90,
                redTo: 100,
                yellowFrom: 75,
                yellowTo: 90,
                minorTicks: 10
            };
            var chart = new google.visualization.Gauge(document.getElementById('dvChart'));
            chart.draw(data, options);
        }
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
    <asp:UpdatePanel runat="server">
        <ContentTemplate>
            <div id="dvChart"></div>
        </ContentTemplate>
    </asp:UpdatePanel>
</asp:Content>

Screenshot