How can I change the color a label on a bar chart? - extjs4.1

Using the example from the docs Ext.chart.series.Bar it should be pretty easy to achieve this.
The series has a label config that contains a color properties. Changing this has no effect. Or am I missing something?
I would like to display a white text on top of the bars.
Working code for the example
http://jsfiddle.net/dfDb8/
On line 48 I try to set the color to white
label: {
display: 'insideStart',
field: 'data',
renderer: Ext.util.Format.numberRenderer('0'),
orientation: 'horizontal',
color: '#fff' //this is what I want to change
'text-anchor': 'middle'
},
Any ideas?

The following attribute:
fill: '#fff'
seems to work. I am not completely sure why though.

Related

How to give a padding in between x-axis labels in React-Native-Chart-Kit?

Is there a way to give a custom space/padding in between x-axis Labels in React-Native-Chart-Kit? Example if we have labels from Jan-Dec, x-axis labels in the chart gets very compact. And even if we give a custom space between x-axis Labels then how do we give a Horizontal scroll feature for the full chart since it overflows onto the right side. Tried with following. Didn't work. Please help. Thanks.
propsForLabels: {
fontSize: "14",
fill: "rgba(10, 10, 10, 1)",
fontWeight: 500,
padding: 5
},
You can try horizontalOffset or check this issue looks like you can use patch or fork from this issue https://github.com/indiespirit/react-native-chart-kit/issues/538 to resolve your problem.

In cytoscape.js, how to create "repeating-linear-gradient"-like style on node?

I'm using JSON to specify the "style" of my graph. I need to make a node to have a background like this. In CSS, it would be:
background: repeating-linear-gradient(
45deg,
white,
white 10px,
red 10px,
red 20px
)
How can I do it in the JSON format "style" for cytoscape.js? I tried something like the following:
{
selector: '.someClass',
style: {
'background-image': 'repeating-linear-gradient(45deg, white, white 10px, red 10px, red 20px)',
},
}
But that doesn't work. Any suggestions how to do this? Thanks!
I don't see repeating-linear-gradient anywhere in the docs. Did you carefully read the docs?
Try using a data uri for background-image if you want to programmatically create an image.
http://js.cytoscape.org/#style/background-image

Measure text in titanium

I'm writing an app and need to paint text, It must to measure text to get point to paint. But in my knowledge, titanium don't support it. How can I do that
Measure text as in length of the text string? If your text is in a textfield you can get the .value out of it and then use string lengths to get out it's length.
I feel like this is what you want;
var label1 = Ti.UI.createLabel({
color: '#900',
font: { fontSize:48 },
text: 'A simple label',
textAlign: Ti.UI.TEXT_ALIGNMENT_CENTER,
top: 30,
width: Ti.UI.SIZE, height: Ti.UI.SIZE
});
win.add(label1);
label1.addEventListener('postlayout', function(e) {
var label1_height = e.source.rect.height;
var label1_width = e.source.rect.width;
Ti.API.info(label1_height, label1_width);
});
Change the window name to yours, then run it. Should do the trick. Print the width and height of your label.

How to use CSS to change font color of emptyText

I am using a non-editable objectPicker and setting the empty text:
this.statePicker = Ext.create('Rally.ui.picker.MultiObjectPicker', {
modelType: 'State',
id: 'statePicker',
matchFieldWidth: false,
editable:false,
emptyText: "Select...",
placeholderText: "Select...",
width: 80,
listeners: {
select: this._getFilter,
deselect: this._getFilter,
scope: this
},
});
I want to format the emptyText (emptyText: "Select...",) to be white with a background color. Using the below CSS, the background color displays perfectly, but the text color stays gray.
.x-form-empty-field {
color: #FFFFFF !important;
background-color: #085478;
}
Ihave tried other classes but none change the font. It stays gray! Please help?
The 'emptyText' is applied to the field using the 'placeholder' HTML5 attribute. The answer is going to vary depending on which browser you are using.
Here is a guide that demonstrates how to style the placeholder text in the various browsers that support it: http://css-tricks.com/snippets/css/style-placeholder-text/
Here is some useful information about the placeholder attribute in general (also includes styling examples): http://www.hongkiat.com/blog/html5-placeholder/
Hope this helps!

Questions on formatting and clearing the rallymultiobjectpicker

I am using the rallymultiobjectpicker to filter my grid but need some help on the following:
var cb = Ext.create('Rally.ui.picker.MultiObjectPicker', {
modelType: 'Project',
id: 'projectPicker',
matchFieldWidth: false,
editable:false,
emptyText: "Project",
//emptyCls: 'x-form-empty-field',
placeholderText: "",
loadingText: "",
width: 80
});
1: How do I clear the selected values (the combobox has the clearValue method)?
2: I am using a non editable ObjectPicker and setting the empty text. I want to format the emptyText to be white with a background color using CSS styling. The background color displays perfectly, but the text color stays gray no matter what class I use!
.x-form-empty-field {
color: #FFFFFF !important;
background-color: #085478;
}
4: How do I remove or hide the Search icon?
3: Is it possible to use a WsapiDataStore instead of a modelType as a data source?
I have struggled with this for days, any help would be much appreciated!
To clear the ObjectPicker selected values, ObjectPicker.setValue([]) works perfectly - thanks Kyle.
(I have opened a new question for queries 2and 4)