@neenreva
@cannonjarrod19
Submitted
I used Chart.js and had difficulty getting function to border-radius of bars in the chart as well as updating tooltip info upon hover. Feedback welcome on any improvements as I'm early on self-taught and trying to improve skills.
@neenreva
Posted
Just had fun with ChartJS myself. The docs could probably be better but I found some things you might be looking for in particular :
let myChart = new Chart("myChart", {
type: "bar",
data: { },
options: {
elements: {
bar: {
borderRadius: 'your value here',
borderSkipped: false,
}
}
}
Tooltips are a little trickier. I played with these in the console till I got what I wanted.
let myChart = new Chart("myChart", {
type: "bar",
data: { },
options: {
plugins: {
tooltip: {
callbacks: {
title: function (context) {
context = "$" + context[0].formattedValue;
return context;
},
label: function (context) {
context = "";
return context;
},
},
}
}
My code here if you want some specific references to how I handled it. Hope this helps
@darryncodes
Submitted
Hi everyone 👋
This challenge was gruelling and rewarding in equal measures.
I took it as an opportunity to implement and learn the following:
I've had a few thoughts on where I can improve the project further over the next few weeks:
Any feedback that could help me to improve would be very welcome!
Happy coding 🤙
@neenreva
Posted
Nice work as always. When you mentioned the formatting improvements for the future the toLocaleString() method comes to mind. I'll leave an MDN link and let you figure out if it's useful.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString
Marked as helpful
@JAValentino
Submitted
@neenreva
Posted
I think the report is mostly due to the live link needing to be fixed. In the Github repository hit the settings tab and find the 'pages' section. Select your main branch and save. Resubmit the new live link in the challenge and refresh the view.
Marked as helpful
@Ammyy9908
Submitted
@neenreva
Posted
Overall this renders pretty well. The few things I see are the drop shadow on the payment button and the alignment of the card. The accessibility issues are something you'll have to add in the html. Semantic html is something I'm new to as well but you'll quickly see that it helps organize and ends up being more readable for others looking at your code. It will also help with SEO and users that may use screen readers. I'll leave a link that is a quick reference.
https://www.w3schools.com/html/html5_semantic_elements.asp
@GoranK89
Submitted
@neenreva
Posted
Very good overall. Take this for what it's worth because I'm a noob myself. I noticed that some of your colors were off. Are you getting the values they give in the style-guide? If not those will bring this to almost perfect. Keep it up!
Marked as helpful
