change font size of axisLabel - d3.js

How to increase the font size of only the axisLabels and not tick labels.
As you can see the axislabel font size is too small. if i give styling to text, all the text in chart is changed. I just want to change axislabel i.e Priority and Number of Alerts in this case to change. Is there a way to access only axisLabels?

This example : http://jsfiddle.net/thatOneGuy/juY5E/336/
I have appended a button that when clicked changes the font colour and the font size.
First off, when creating the text, I give it an ID (line 116) :
svg.append("text")
.attr('id','xAxisText')
Then I created a function that gets called when you click the button :
function changeFontColour(){
d3.select('#xAxisText').style('fill','red').style('font-size', 30)
}
This selects the text, then fills it red, then changes the font size to 30 :)

Related

D3 expanding rectangle's text is not adjusted

I have a rectangle and a text created through D3 which are grouped together like below.
<g>
<rect></rect>
<text></text>
</g>
In a javascript function I'm expanding this rectangle's width to allow the the value of text to be displayed in one go. (If the value is too long as the text value is set dynamically). This is working fine. However even though the rectangle width is expanding depending on the text value size , D3 text element is not showing the complete text value that is added, eventually the text is moved to left and the first bit of it can't be seen.
Do I need to increase the text element's width too or what would be the solution for this?
[UPDATE]
Following is the current code.
var elms = d3.selectAll("[id=s]"); // has the rectangle and text elements
var s = d3.selectAll("[id=s]").selectAll("text"); // just the text elements
var minimumValue = 100;
// updating rectangle width
elms.attr('width', function() { return dynamic < minimumValue ? minimumValue : dynamic;});
Now I need a way to update the position of the text element when the rectangle is expanded. Hope this is more clear. I just tried manually updating 'x' property of text element that works. But can I derive this value dynamically to set it within this function?
In case someone is looking for this, was able to get the text new 'x' value by x of rectangle + half of rectangle's width (and similar for y but with the height).
Got the answer from this link (How to place and center text in an SVG rectangle)

Resize Textbox Programmatically in Telerik Report

I have created a table then put a Textbox named "txtTextBox" into a cell of table. The width of the Textbox is 2 inch. In code I change width of Textbox like below
There are 2 case when report viewed:
Case 1: new width > designed width (2inch)
txtTest.Width = Unit.Inch(2.5); ==> The Textbox is showed longer. It is right
Case 2: new width < designed width (2inch)
txtTest.Width = Unit.Inch(1.5); ==> The Textbox is still showed with 2 inch. Expected it should shorter
how to resize column table fit with new width of Textbox?
Telerik doesn't allow width changes after items initialized. You must define your items programmatically instead of designer to do this.
http://www.telerik.com/forums/auto-resize-the-column-headers-of-the-telerik-reporting-table

Setting the size of an SVG icon in a table cell

I'd like to increase the size of an SVG icon that's displayed inside of a PySide/Qt table cell
icon = QtGui.QIcon('icon.svg')
entry = QtGui.QTableWidgetItem()
entry.setIcon(icon)
entry.setTextAlignment(QtCore.Qt.AlignHCenter | QtCore.Qt.AlignVCenter)
table.setItem(row_index, column_index, entry)
Absolutely nothing I try increases the size of the displayed SVG. It is currently displayed as a very small icon and also seems to ignore the alignment. The QIcon docs say that items can be scaled, so there must be a way.
What am I doing wrong?
You should add table.setIconSize(QSize(w, h) (if you use QTableWidget) and entry.setSizeHint(QSize(w, h), docs here, like so:
table.setIconSize(QSize(50, 50))
icon = QtGui.QIcon('icon.svg')
entry = QtGui.QTableWidgetItem()
entry.setSizeHint(QSize(50, 50))
entry.setIcon(icon)
entry.setTextAlignment(QtCore.Qt.AlignHCenter | QtCore.Qt.AlignVCenter)
table.setItem(row_index, column_index, entry)
The alignment cannot be changed I'm afraid (maybe is doable customizing QTableWidget class). If alignment is a must maybe you can use QTableWidget.setCellWidget(), see this answer.

Resizing images in Etalage Jquery Zoom plugin using Javascript

I am working on a webpage that lists the details of a product .
The product details include an image that can be zoomed using the Etalage Jquery Zoom plugin.
I am able to change the image that is displayed in the Etalage Jquery plugin depending on certain attributes of the product.
I am dynamically changing the images by executing the statement
$('#etalage').etalage({
show_descriptions: false,
small_thumbs: 0
}).show();
The problem is that the source image looses its assigned height and width.
I would like to know how to assign a height and width to the source image using JavaScript
after changing the image in the Etalage plugin.
Regards
Mathew
Resolved this issue by observing the values that were being assigned to the
following parameters when the size of the source image was correct.
Assigning those values while calling the show() method solved my problem
$('#etalage').etalage({
show_descriptions: false,
small_thumbs: 0,
source_image_width: 900, // The source/zoomed image width (not the frame around it) (value in pixels)
source_image_height: 1200,
thumb_image_width:480, // The large thumbnail width (excluding borders / padding) (value in pixels)
thumb_image_height: 480,
autoplay:false,
zoom_area_width: 340, // Width of the zoomed image frame (including borders, padding) (value in pixels)
zoom_area_height:495, // Height of the zoomed image frame (including borders, padding) (value in pixels / 'justify' = height of large thumb + small thumbs)
zoom_area_distance: 20,
}).show();

JLabel not displaying all the characters even after dynamically changing font size

I am trying to fit a sentence that changes often, in to a few jlabels. Widths of my 3 jlabels stay unchanged all the time. What I am doing is changing the font size so all the characters can fit with out non being out of the display range of the labels. What I do is call below code snippet when ever sentence is changed.
Here is my code
String sentence = "Some long sentence";
int SentenceLength = sentence.length();
int FontSize = 0;
// sum of widths of the three labels
int TotalLblLength=lbl_0ValueInWords.getWidth()+lbl_1ValueInWords.getWidth()+lbl_1ValueInWords.getWidth();
/*decide the font size so that all the characters can be displayed
with out exceeding the display renge(horizontal) of the 3 labels
Inconsolata -> monopace font
font size == width of the font*2 (something I observed, not sure
if this is true always) */
FontSize=(TotalLblLength/SentenceLength)*2;
// max font size is 20 - based on label height
FontSize=(FontSize>20)?20:FontSize;
lbl_0ValueInWords.setFont(new java.awt.Font("Inconsolata", 0,FontSize));
lbl_1ValueInWords.setFont(new java.awt.Font("Inconsolata", 0,FontSize));
lbl_2ValueInWords.setFont(new java.awt.Font("Inconsolata", 0,FontSize));
int CharCount_lbl0 = width_lbl0 / (FontSize / 2);
int CharCount_lbl1 = width_lbl1 / (FontSize / 2);
int CharsCount_lbl2 = width_lbl2 / (FontSize / 2);
/*Set texts of each label
if sentence has more than the number of characters that can fit in the
1st label, excessive characters are moved to the 2nd label. same goes
for the 2nd and 3rd labels*/
if (SentenceLength > CharCount_lbl0) {
lbl_0ValueInWords.setText(sentence.substring(0, CharCount_lbl0));
if (SentenceLength > CharCount_lbl0 + CharCount_lbl1) {
lbl_1ValueInWords.setText(sentence.substring(CharCount_lbl0, CharCount_lbl0 + CharCount_lbl1));
lbl_2ValueInWords.setText(sentence.substring(CharCount_lbl0 + CharCount_lbl1, SentenceLength));
} else {
lbl_1ValueInWords.setText(sentence.substring(CharCount_lbl0, SentenceLength));
}
} else {
lbl_0ValueInWords.setText(sentence);
}
But even after resetting font size sometimes the last character goes out of the display range. I have removed margines from the jlabels that may cause this. This happens for random length sentences. I can solve the problem for the application by reducing label width used for the calculations(hopefully)
Can anyone explain me the reason? Could be because of some defect in the fonts symmetry?
There is no such thing as font symmetry?
There are 2 types of fonts for what you are dealing with. Monospace fonts, and non-monospace fonts. Monospace fonts have the same exact width for every single character you can type. The others do not.
On top of that, fonts are rendered differently across different OS's. Something on windows will be around 10-20% longer on Mac because they space out the fonts differently.
Whatever it is you are trying to do with JLabels, stop. You should not be using 3 JLabels to show 3 lines of text because they dont fit. Scrap them and use a JTextArea. It has text wrap, you can set the font, and remove the margin/border/padding and make it non-editable. You can customize it very easily so it is indistinguishable from a JLabel, but it will save you a ton of work.
Pick the right tool for the right job.

Resources