0.4.0 Unable to Get Working #33
Description
Hi Team,
I am using vanilla .NET MVC website (have razor cshtml view file) where I have got both chart.js and chartjs-plugin-colorschemes installed (installed via LibMan client side library). Having followed instructions, I am receiving the following message on console (F12 dev tools in browser):
Uncaught TypeError: Cannot read properties of undefined (reading 'plugins') in both .min.js and .js versions.
Inspecting the main JS file the error is here:
Chart.defaults.global.plugins.colorschemes = {
scheme: 'brewer.Paired12',
fillAlpha: 0.5,
reverse: false,
override: false
};
Additionally, I tried the NPM runkit option:
https://npm.runkit.com/chartjs-plugin-colorschemes and it returns the same error.
My Razor Page:
<div class="row">
<div class="col-lg-4">
<canvas id="myChart"></canvas>
</div>
</div>
<script>
const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
datasets: [{
label: '# of Votes',
data: [4, 6, 3, 5, 2, 3],
borderWidth: 1
}]
},
options: {
plugins: {
colorschemes: {
scheme: 'brewer.GnBu6'
}
}
}
});
</script>
My Master / Layout page:
<script src="~/Content/js/ChartJS3.7.1/chart.min.js"></script>
<script src="~/Content/js/ChartJsColorSchemes0.4.0/chartjs-plugin-colorschemes.js"></script>
My Index View:
The bar chart renders but without any colours scheme applied.
Perhaps I am not doing something right? Apologies if that is the case.