In a d3 graph, we get comma as thousands separator as default and I would like to remove them and have the x-axis ticks displayed as for example "2 000 000" instead of "2,000,000"
This is what I've tried:
private scaleX: ScaleLinear<number, number>;
private xAxisComponent: any;
// Define an x Axis
const axisNumberFormat: FormatLocaleDefinition = {
'decimal': '.',
'thousands': ' ',
'grouping': [3],
'currency': ['', ''],
};
const axisFormatLocale: FormatLocaleObject = this.d3.formatDefaultLocale(axisNumberFormat);
this.xAxisComponent = this.d3.axisBottom(this.scaleX).tickFormat(axisFormatLocale);
However, the assignment on the last line does not work, it says "Argument of type 'FormatLocaleObject' is not assignable to parameter of type 'null'." Any tips? Or am I doing this the wrong way, is there another way to put together a format string to send to the tickFormat() method?
The last line will work if .format('') is added to axisFormatLocale:
this.xAxisComponent = this.d3.axisBottom(this.scaleX).tickFormat(axisFormatLocale.format(''));
Related
In cypress I have
Book
:This is the book of
English
how to test that 'Book:This is book of English' is in order ?
I not having single row I have multiple rows like this
cy.get('span').then((Val)=>{ const text=val.text().trim(':').toString(); });
The answer from #AsadMusharaf needs an extra step:
cy.get('span')
.then($span => {
return $span.text() // extract test
.split(': ') // split it at ": "
})
.should('deep.equal', ['Book', 'English']) // compare to ordered array
You have bold <b> elements, will need to add b in the selector
cy.get('span b')
.invoke('text')
.should('eq', 'BookEnglish')
cy.get('span').then(span => {
const words = span.split(':');
const firstword = words[0]
const secondword = words[1]
cy.log(firstword, secondword);
Try this. Here we are splitting the pair of words by ":" and storing them in array vairabled and calling that variables. Array [0] will have the text "Book" and array [1] will have the text "English"
you could just see if the whole string matches with contains after or as part of get
cy.get('span').contains('Book: English').should('exist')
// or
cy.get('span:contains("Book: English")').should('exist')
In my app, I want to format various numbers using a library, and I have a couple of related questions (which I don't submit separately because I think they might represent a very common set of problems)
Format a number using a format string constant to achieve compressed literals such as 1.2k or 1.23M
Format a number using a format string constant to have a thousand delimiter applied, ragardless of client's locale settings.
I tried to achieve a formatting result, where the language thousand delimiter is actually taken into consideration
http://jsfiddle.net/erbronni/19mLmekt/
// load a language
numeral.language('fr', {
delimiters: {
thousands: ' ',
decimal: ','
},
abbreviations: {
thousand: 'k',
million: 'M',
billion: '',
trillion: 't'
},
ordinal : function (number) {
return number === 1 ? 'er' : 'ème';
},
currency: {
symbol: '€'
}
});
numeral.language('fr');
document.getElementById('f1').innerHTML = numeral(12345678).format('0 000') // intended output: '12 345 678' -- does not seem to work
Numeral.js has this built in. It can be easily achieved using a such as .format('0.00a').
Some full examples:
numeral(1000000).format('0a') will return 1m
numeral(250500).format('0.0a') will return 250.5k
numeral(10500).format('0.00a') will return 10.50k
I need to get data from text fields. I used TkText but could not pass it the argument 'textvariable'. This argument only works for Tk::Tile:Entry is a single line in height, and I need 3. I went to change settings for :rowspan when rendering 'Entry' widget, but it did not help.
$message = TkVariable.new
text = Tk::Tile::Entry.new(content) {
textvariable $message # not worked in TkText :(
width 1
font TkFont.new('bold times 12')
pack('side' => 'left', 'padx'=> '0', 'pady'=> '0')
}
How it to make?
The text widget has a get method, which takes two indices that describe a region to get. The first character is the string 1.0, and the last character is the string end-1c (technically, the last character in the widget is end, but tk always adds an extra newline at the end which you normally don't want to get)
My ruby is very rusty, but I think this will work:
data = text.get('1.0', 'end-1c')
Say I have an object alphabets and I want to set a couple of properties from another object like-
alphabets.a = data.a
alphabets.b = data.b
alphabets.c = data.c
Is there a way to remove the redundant usage of the variable alphabets and data?
UPDATE:
Assume that the properties have the same name. Now to remove the over use of property the variable reference data I can do the following
alphabets = (-> {aa, bb,cc}).call data
But the problem is that this will create a new object alphabets and what I want is that it should just add the properties to an already available object.
All you need to do is use the bracket notation of javascript, coupled with coffescript's for/of comprehension:
coffee> alphabets
{ a: '1', b: '2', c: '3' }
coffee> data = {}
{}
------> for k,v of alphabets # use Ctrl-V to get the multiline prompt
....... data["#{k}#{k}"] = v
[ '1', '2', '3' ]
coffee> data
{ aa: '1', bb: '2', cc: '3' }
coffee>
How can I format monetary values of the y-axis of my graph bar to be so:
R$ 123.456,00
Instead of:
R$ 123,456.00
Currently I'm using this function to format, but can't make this simple change:
var format = d3.format(',.2f'); // Need to change this, but don't know how
chart.yAxis.tickFormat(function(d) {
return "R$ " + format(d);
});
I've already searched in D3 documentation, but can't find anything.
With d3 5.5 you can create a custom locale
https://github.com/d3/d3-format#formatLocale
Also note in the specifier(arg passed to .format) I now include a $ This will automatically include the currency prefix in the formatted string.
const customD3Locale = d3.formatLocale({
decimal: ",",
thousands: ".",
grouping: [3],
currency: ["R$",""]
})
const format = customD3Locale.format('$,.2f');
The format method don't seems to allow custom thousands and decimal separators. I think that you should replace the symbols yourself:
var format = d3.format(',.2f');
// Format the number, adding thousands and decimal separators
var label = format(1234.00);
// Replace the . and the , symbols. The ! symbol is necessary to do the swap
// it can be other symbol though
label = label.replace('.', '!');
label = label.replace(',', '.');
label = label.replace('!', ',');
// The result is 'R$ 1.234,00'
d3.select('#chart').append('p').text('R$ ' + label);
This jsfiddle have the replacement code.