troubleshooting Question

Chart.js not showing the line

Avatar of Bob Schneider
Bob SchneiderFlag for United States of America asked on
8 Comments2 Solutions33 ViewsLast Modified:
Any one have any idea why my Chart.js is not showing the line?  The points are in the correct place, as are the axes labels.  They were showing.  Now sure what I did wrong.
<script src=""></script>
<body data-open="hover" data-menu="horizontal-top-icon-menu" data-col="2-columns" class="horizontal-layout horizontal-top-icon-menu 2-columns ">

<!-- navbar-fixed-top-->
    <!--#include virtual="/templates/admin/navNavbar.asp"-->
    <!--#include virtual="/templates/admin/navSearch.asp"-->
<!-- ////////////////////////////////////////////////////////////////////////////-->
<!-- Horizontal navigation-->
<!--#include virtual="/templates/admin/navHorizontal.asp"-->
<!-- main content -->

<div class="app-content content container-fluid">
    <div class="content-wrapper">
        <div class="content-body">
             <div id="content">
                <div class="bg-warning" style="text-align:right;">
                    <a href="fitness_graph.asp">Fitness Graph</a>&nbsp;|
                    <a href="pulse_graph.asp">Pulse Graph</a>&nbsp;|
                    <a href="weight_graph.asp">Weight Graph</a>&nbsp;|
                    <a href="sta_graph.asp">STA Graph</a>
                <h3>My eTRaXC Pulse Graph</h3>

                    There is nothing like a visual display to help us really see how things are going.  Whether the news is good or bad, a 
                    visual reference to measure with is incredibly helpful.  You will find that here.
            <section class="flexbox-container">
                <div class="col-md-4 offset-md-4 col-xs-10 offset-xs-1  box-shadow-2 p-0">
                    <div class="card border-grey border-lighten-3 m-0">
                        <div class="card-body collapse in">
                            <div class="card-block">
                                <canvas id="myChart" style="width:100%;max-width:600px"></canvas>

                                    var xValues = [<%=sXVal%>];
                                    var yValues = [<%=sYVal%>];
                                    new Chart("myChart", {
                                    type: "line",
                                    data: {
                                        labels: xValues,
                                        datasets: [{
                                        fill: false,
                                        lineTension: 0,
                                        backgroundColor: "rgba(0,0,255,1)",
                                        borderColor: "rgba(0,0,0,0)",
                                        data: yValues
                                    options: {
                                        legend: {display: false},
                                        scales: {
                                        yAxes: [{ticks: {min: 40, max:60}}],

Join our community to see this answer!
Unlock 2 Answers and 8 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 2 Answers and 8 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros