Dear visitor, despite the COVID-19 outbreak, our team continues operating at full speed.

Also, here is the form where you can apply for a special discount and we will contact you with possible options. Stay safe and continue achieving your business goals.

Fill the form
Get Free Trial
Get Free Trial

when using reversedaxes to true ,the labels on the x axes on the line chart doesn’t show.

Answered
raviraj bisram asked on February 19, 2020

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
}
]
}

2 answers

Public
Mykhailo Halaida Mykhailo Halaida Flexmonster February 20, 2020

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

Public
raviraj bisram February 21, 2020

Thanks Mykhailo, 
It works. I really appreciate the prompt response and support.
Take care and have a great day ahead.
cheers Raviraj

Please login or Register to Submit Answer