Conditional formatting of labels on x axis with dimple - d3.js

I have a simple Dimple chart similar to the basic example at:
http://dimplejs.org/examples_viewer.html?id=bars_vertical
The x axis shows dates. Question: how to display the label in eg. red color if the date matches today ?
I tried unsuccesfully:
- to add tags but this is a no-go since svg's text does not support html
- to change the class name through Dimple or d3.js but no success
Probably the result can be achieved by directly accessing the DOM node and changing the CSS fill style but is there a mode elegant method ?

Related

Q: Recharts hide every other label?

Hiyas, I'm wondering if it's possible to render every other xAxis label in recharts?
I have a design I'm working from that has vertical grid lines on either side of an xAxis label. So, I'm using <ReferenceLines> in place of a <CartesianGrid>, and that seems to work well. However, I haven't found a way to render only some of the xAxis labels.
I could mutate the date coming into the chart, but then I lose the data-points date value in the <Tooltip> hover. Which if possible I'd like to keep.
Here's effectively what I have:
And here's what I'm aiming for:
Ok, so I found a "way" by leveraging the tickFormatter attribute on <XAxis />. Albeit, the best approach would be for tickFormatter to return index like some of the other recharts components offer with format. However, for the time being I'm simply finding the index of a given xAxis label, from my dataset, and then checking if it's an even/odd number.
What you're looking for is the interval attribute. This controls whether to show all or some of your xAxis labels. By default it is set to preserveEnd which auto calculates how many ticks to show.
If you want to show all ticks, you must set interval=0
Docs https://recharts.org/en-US/api/XAxis#interval

Amcharts legend dynamic resizing

I want my legend to adjust itslef according to the amount of data that is coming in like highcharts . For example if I have only one legend I don't wanna legend to take the length as the div itself and I also have multiple pods .if there are a lot of legends I want it to have scrollbar instead now it's reducing the size of the chart itself.
Pls give your valuable inputs .
You can have the Legend rendered inside a defined Element referring to it using divId.
Then just make sure your legend element is setup to use scrollbars.
Please check the example here: https://codepen.io/team/amcharts/pen/dac1c66de18a50661c8195d4b792a30c

d3 bar chart does not extend to full width of svg

I have a bar chart (http://tributary.io/inlet/4720197) that plots a dataset with a large number of points that I can't get to fill the entire width of the svg. I had the same issue with a line chart and was able to resolve by using rangePoints.
I've been attempting something similar with this chart but can't quite get the right combination (it's using two scales for the grouping) and am unclear how to get the side-by-side bars that I previously accomplished with rangeBand() given that function does not exist with rangePoints. What am I missing?

jQPlot pie chart - how to alter text color of pie slice labels

I am using jQPlot to draw a pie chart.
How can I change the color of the text that appears on each pie slice? There does not appear to be an option to do this.
It is not really a good idea to modify the distributed jqplot CSS file, because that makes for poor maintainability (you have to re-apply your changes if you, or anyone else, ever upgrades).
Instead, I recommend overriding the CSS using CSS Specificity Rules (see the Star Wars Version).
For example, given
<div id='myChart'; style="width:400px;height:300px;background-color:#eedd33">
</div>
You could define a CSS rule
#myChart
{
color: Teal;
}
You don't want to modify the given CSS file as it will modify all uses of the library.
You don't want to create a CSS rule for the entire chart container, as it will also apply the color to any legend or other text that will inherit it.
Instead, just modify the class jqplot uses for its data labels: .jqplot-data-label
Use this:
$('.jqplot-data-label').css("color","white");
This way, only the data labels will change color. All other text such as legend labels will not be changed.
In the end I just modified the top-level jqplot css that affects all text (as I wanted it all the same colour anyway).

Extending chart functionality in SSRS

The default chart object in the SQL Server (2005) Business Intelligence Development Studio doesn't seem to some have formatting options like :
specifying the text direction of labels in the x and y axis
adding a trendline to a bar chart
arbitrarily resizing items in a chart - for example, if I resize the chart object, everything gets resized accordingly but I can't keep the size of the chart the same while extending the area of the legend for instance.
multiline chart labels
So what I want to know is
is there any easy answer to the formatting problems mentioned above?
what websites/books/resources/examples would you recommend I look
into for extending the functionality of the chart object?
Some colleagues of mine gave up on the stock control and bought Dundas charts
The stock charts are cut down versions of Dundas.
yes you can specify the text direction of labels in the x and y axis
Go to chart properties and in the tab x and y axis enter the chart title and in the title align use the combination like left/right/center align.
you can change the legend line go to the chart properties click legend tab inside this
there is an option for "display legend inside plot area" and you can include the trendline there
you can use multiline text labels when the text limits extends
I don't see how you can resize the legend, puting inside the plot area looks ugly for pie-chart
I'd recommend go with the dundas chart components gbn suggested.
If that's not possible at least this article should solve issue 1.

Resources