when using reversedaxes to true ,the labels on the x axis doesn't show.
code i was playing with
var pivot = new Flexmonster({
container: "#pivot-container",
componentFolder: "https://cdn.flexmonster.com/",
toolbar: true,
report: {
dataSource: {
data: getData()
},
options: {
viewType: "charts",
chart: {
//type: "pie",
// showAllLabels: true,
reversedAxes: true,
}
},
slice: {
rows: [{
uniqueName: "Color"
}],
columns: [
{
uniqueName: "M",
caption: "Month"
},{
uniqueName: "[Measures]"
}
],
measures: [{
uniqueName: "Quantity"
}]
}
}
});
function getData() {
return [{
"Color": {
"type": "string"
},
"M": {
"type": "month",
"caption": "Month"
},
"W": {
"type": "weekday",
"caption": "Week Day"
},
"Country": {
"type": "level",
"hierarchy": "Geography",
"level": "Country"
},
"State": {
"type": "level",
"hierarchy": "Geography",
"level": "State",
"parent": "Country"
},
"City": {
"type": "level",
"hierarchy": "Geography",
"parent": "State"
},
"Price": {
"type": "number"
},
"Quantity": {
"type": "number"
}
},
{
"Color": "green",
"M": "September",
"W": "Wed",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 174,
"Quantity": 22
},
{
"Color": "red",
"M": "March",
"W": "Mon",
"Country": "USA",
"State": "California",
"City": "Los Angeles",
"Price": 1664,
"Quantity": 19
},
{
"Color": "red",
"M": "January",
"W": "Mon",
"Country": "Canada",
"State": "Quebec",
"City": "Montreal",
"Price": 1190,
"Quantity": 292
},
{
"Color": "green",
"D": "04/08/2014",
"M": "August",
"W": "Fri",
"Country": "USA",
"State": "California",
"City": "Los Angeles",
"Price": 1222,
"Quantity": 57
},
{
"Color": "white",
"M": "March",
"W": "Wed",
"Country": "USA",
"State": "California",
"City": "Los Angeles",
"Price": 7941,
"Quantity": 73
},
{
"Color": "red",
"M": "August",
"W": "Wed",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 6829,
"Quantity": 19
},
{
"Color": "green",
"M": "January",
"W": "Wed",
"Country": "Canada",
"State": "Quebec",
"City": "Montreal",
"Price": 2995,
"Quantity": 54
},
{
"Color": "white",
"M": "February",
"W": "Mon",
"Country": "USA",
"State": "California",
"City": "Los Angeles",
"Price": 2471,
"Quantity": 93
},
{
"Color": "yellow",
"M": "March",
"W": "Fri",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 6650,
"Quantity": 40
},
{
"Color": "blue",
"M": "February",
"W": "Wed",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 865,
"Quantity": 45
},
{
"Color": "purple",
"M": "August",
"W": "Wed",
"Country": "Canada",
"State": "Quebec",
"City": "Montreal",
"Price": 511,
"Quantity": 46
},
{
"Color": "blue",
"M": "September",
"W": "Mon",
"Country": "Canada",
"State": "Quebec",
"City": "Montreal",
"Price": 981,
"Quantity": 18
},
{
"Color": "blue",
"M": "September",
"W": "Fri",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 284,
"Quantity": 24
},
{
"Color": "yellow",
"M": "September",
"W": "Fri",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 284,
"Quantity": 13
},
{
"Color": "violet",
"M": "September",
"W": "Fri",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 284,
"Quantity": 76
},
{
"Color": "black",
"M": "September",
"W": "Fri",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 284,
"Quantity": 24
},
{
"Color": "white",
"M": "September",
"W": "Fri",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 284,
"Quantity": 45
},
{
"Color": "orange",
"M": "September",
"W": "Fri",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 284,
"Quantity": 45
},
{
"Color": "onyx",
"M": "September",
"W": "Fri",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 284,
"Quantity": 45
},
{
"Color": "grey",
"M": "September",
"W": "Fri",
"Country": "Canada",
"State": "Ontario",
"City": "Toronto",
"Price": 284,
"Quantity": 45
}
]
}
Hi Raviraj,
Thank you for posting your question.
Please note that when the reversedAxes
property value is set to true, the measures' position has to be switched as well.
In your case, in order for the labels on the x-axis to be displayed correctly while the reversedAxes
is enabled, the measures in the slice need to be moved to rows. This can be done either using the Field List interface or by manually editing the slice configurations through code.
We've prepared a quick JSFiddle example based on the data you provided to display this approach: https://jsfiddle.net/flexmonster/s4hr8gwj/
Please let us know if this helps.
Best regards,
Mykhailo
Thanks Mykhailo,
It works. I really appreciate the prompt response and support.
Take care and have a great day ahead.
cheers Raviraj