Chart CSS

[Anonymous]

Hi alex I understand that individual styling is not really supported by you but could you shed any light how to do some CSS to edit the graph. I have attached two images a before and after of how I would like it set out.

Basically I want to display multiple static charts on one page about 4or 5 charts wide but just the actual graph non of the price of timeline. I have tried using visual CSS and it struggles as there are multiple layers

Excuse the rough drawing I did it on a small screen mobile.
Any help would be appreciated

Regards,

Jamie

Attachments:

You must be logged in to view attached files.

[alexg]

Hello Jamie,

The TradingView chart is rendered on a canvas, so it doesn’t lend itself to CSS styling. Fortunately the chart and each of its axes is rendered on distinct canvas elements, so you could hide the axes using CSS like so:

.tv-lightweight-charts table tr:nth-child(2),
.tv-lightweight-charts table tr:nth-child(1) td:nth-child(3) {
	display:none;
}

I do intend to add some more options to Customizer, so that the library renders the charts with different styling parameters depending on user settings.

Hope this helps. Let me know if have any further questions on this.

with regards

P.S. While I do not promise to be able to help with CSS, I generally do try to help when possible. The reason I do not make promises is because I often get requests from people who don’t know what an HTML class is, and they expect me to do big changes to the layout of their sites, while using sub-par themes with confusing rules.

All web developers should spend a few minutes studying CSS selectors and selector specificity rules. That’s all you need to know in most cases. MDN is a good resource and a good article that I often recommend for selector specificity is https://www.smashingmagazine.com/2007/07/css-specificity-things-you-should-know/

[Anonymous]

Thank you.

I have also added

.dashed-slug-wallets-exchange div table{
border-style:none;

}

Regards,

Jamie

[Anonymous]

I did a little more styling and have given it a radius.

[alexg]

That’s great!

Eventually I want to add more Customizer options to the Exchange, just like with the parent plugin UIs.

When this is implemented, your CSS rules may interfere with the Customizer implementation. Just something to keep in mind, no big deal.

with regards

[Author]

Posts