Chartjs-What is wrong with my code ? java script chart position

3👍

You use css id(#) selector, but you have class(.)es on your div’s. Change classes to ids.

<div id="Bar">

    <label for="myChart">
        Bar chart Title <br />
        <canvas id="myChart" width="300" height="250"></canvas>
    </label>
</div>


<div id="Pie">
    <label for="myPieChart">
        Pie chart Title<br />
        <canvas id="myPieChart" width="250" height="250"></canvas>
    </label>
</div>

Or change style’s selectors to classes (use .).

.Bar {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 0px;
}

.Pie {
    position: absolute;
    left: 500px;
    right: 0px;
    bottom: 0px;
    top: 0px;
}

Example

#Bar {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 0px;
}

#Pie {
    position: absolute;
    left: 500px;
    right: 0px;
    bottom: 0px;
    top: 0px;
}
<div id="Bar">
    <label for="myChart">
        Bar chart Title <br />
        <canvas id="myChart" width="300" height="250"></canvas>
    </label>
</div>


<div id="Pie">
    <label for="myPieChart">
        Pie chart Title<br />
        <canvas id="myPieChart" width="250" height="250"></canvas>
    </label>
</div>

Leave a comment