Reverse one chart and leave the other unreversed - Synchronized highcharts
up vote
0
down vote
favorite
In order to reverse a chart you have to add reversed: true. It can be done either on the xAxis or the yAxis. In this example provided by Highcharts: https://jsfiddle.net/omaraziz/zg516ruk/ when I add reversed, it reverses all the charts. How can I reverse only one chart? More generally, what is the proper way to do more customization on one chart and not the other when the two are synchronized?
I chose synchronized because I wanted the values from both to be displayed at the same time when scanning from right to left and vice versa.
For now every time I change the legend position, reverse xAxis or yAxis, play with the tooltip, set a max and min for the yAxis, etc. it does it to both.
Here's my JSON data, in case the way to do it is through the JSON file: https://omaraziz.me/CC-chart/activity.json
javascript charts highcharts
asked Nov 14 at 2:17
Later_72
366
add a comment |
up vote
0
down vote
favorite
In order to reverse a chart you have to add reversed: true. It can be done either on the xAxis or the yAxis. In this example provided by Highcharts: https://jsfiddle.net/omaraziz/zg516ruk/ when I add reversed, it reverses all the charts. How can I reverse only one chart? More generally, what is the proper way to do more customization on one chart and not the other when the two are synchronized?
I chose synchronized because I wanted the values from both to be displayed at the same time when scanning from right to left and vice versa.
For now every time I change the legend position, reverse xAxis or yAxis, play with the tooltip, set a max and min for the yAxis, etc. it does it to both.
Here's my JSON data, in case the way to do it is through the JSON file: https://omaraziz.me/CC-chart/activity.json
javascript charts highcharts
asked Nov 14 at 2:17
Later_72
366
Generally you configure only one chart, the reason your configuration options apply to all of them is because you are creating 3 charts with the same code, starting here ` activity.datasets.forEach(function (dataset, i) {. There are many ways to mitigate this, for example you could useif` logic, and match on some element of the chart you want reversed. You could remove the loop and copy the code as many times as you have charts, then you could edit each chart before it is created. Or you could make an id for the charts that you later select and apply options to.
– ewolden
Nov 14 at 7:58
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
In order to reverse a chart you have to add reversed: true. It can be done either on the xAxis or the yAxis. In this example provided by Highcharts: https://jsfiddle.net/omaraziz/zg516ruk/ when I add reversed, it reverses all the charts. How can I reverse only one chart? More generally, what is the proper way to do more customization on one chart and not the other when the two are synchronized?
I chose synchronized because I wanted the values from both to be displayed at the same time when scanning from right to left and vice versa.
For now every time I change the legend position, reverse xAxis or yAxis, play with the tooltip, set a max and min for the yAxis, etc. it does it to both.
Here's my JSON data, in case the way to do it is through the JSON file: https://omaraziz.me/CC-chart/activity.json
javascript charts highcharts
asked Nov 14 at 2:17
Later_72
366
In order to reverse a chart you have to add reversed: true. It can be done either on the xAxis or the yAxis. In this example provided by Highcharts: https://jsfiddle.net/omaraziz/zg516ruk/ when I add reversed, it reverses all the charts. How can I reverse only one chart? More generally, what is the proper way to do more customization on one chart and not the other when the two are synchronized?
I chose synchronized because I wanted the values from both to be displayed at the same time when scanning from right to left and vice versa.
For now every time I change the legend position, reverse xAxis or yAxis, play with the tooltip, set a max and min for the yAxis, etc. it does it to both.
Here's my JSON data, in case the way to do it is through the JSON file: https://omaraziz.me/CC-chart/activity.json
javascript charts highcharts
javascript charts highcharts
asked Nov 14 at 2:17
Later_72
366
asked Nov 14 at 2:17
Later_72
366
asked Nov 14 at 2:17
Later_72
366
asked Nov 14 at 2:17
Later_72
366
asked Nov 14 at 2:17
Later_72
366
366
Generally you configure only one chart, the reason your configuration options apply to all of them is because you are creating 3 charts with the same code, starting here ` activity.datasets.forEach(function (dataset, i) {. There are many ways to mitigate this, for example you could useif` logic, and match on some element of the chart you want reversed. You could remove the loop and copy the code as many times as you have charts, then you could edit each chart before it is created. Or you could make an id for the charts that you later select and apply options to.
– ewolden
Nov 14 at 7:58
add a comment |
Generally you configure only one chart, the reason your configuration options apply to all of them is because you are creating 3 charts with the same code, starting here ` activity.datasets.forEach(function (dataset, i) {. There are many ways to mitigate this, for example you could useif` logic, and match on some element of the chart you want reversed. You could remove the loop and copy the code as many times as you have charts, then you could edit each chart before it is created. Or you could make an id for the charts that you later select and apply options to.
– ewolden
Nov 14 at 7:58
Generally you configure only one chart, the reason your configuration options apply to all of them is because you are creating 3 charts with the same code, starting here ` activity.datasets.forEach(function (dataset, i) {
. There are many ways to mitigate this, for example you could use if` logic, and match on some element of the chart you want reversed. You could remove the loop and copy the code as many times as you have charts, then you could edit each chart before it is created. Or you could make an id for the charts that you later select and apply options to.– ewolden
Nov 14 at 7:58
Generally you configure only one chart, the reason your configuration options apply to all of them is because you are creating 3 charts with the same code, starting here ` activity.datasets.forEach(function (dataset, i) {
. There are many ways to mitigate this, for example you could use if` logic, and match on some element of the chart you want reversed. You could remove the loop and copy the code as many times as you have charts, then you could edit each chart before it is created. Or you could make an id for the charts that you later select and apply options to.– ewolden
Nov 14 at 7:58
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
You can use index variable i to recognize the chart. For example the IFFE function below return true only for the second chart:
xAxis: {
reversed: (function() {
return i === 1
})(),
...
}
Live demo: https://jsfiddle.net/BlackLabel/7fx6jdnw/
answered Nov 14 at 10:38
ppotaczek
3,506129
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
You can use index variable i to recognize the chart. For example the IFFE function below return true only for the second chart:
xAxis: {
reversed: (function() {
return i === 1
})(),
...
}
Live demo: https://jsfiddle.net/BlackLabel/7fx6jdnw/
answered Nov 14 at 10:38
ppotaczek
3,506129
add a comment |
up vote
0
down vote
You can use index variable i to recognize the chart. For example the IFFE function below return true only for the second chart:
xAxis: {
reversed: (function() {
return i === 1
})(),
...
}
Live demo: https://jsfiddle.net/BlackLabel/7fx6jdnw/
answered Nov 14 at 10:38
ppotaczek
3,506129
add a comment |
up vote
0
down vote
up vote
0
down vote
You can use index variable i to recognize the chart. For example the IFFE function below return true only for the second chart:
xAxis: {
reversed: (function() {
return i === 1
})(),
...
}
Live demo: https://jsfiddle.net/BlackLabel/7fx6jdnw/
answered Nov 14 at 10:38
ppotaczek
3,506129
You can use index variable i to recognize the chart. For example the IFFE function below return true only for the second chart:
xAxis: {
reversed: (function() {
return i === 1
})(),
...
}
Live demo: https://jsfiddle.net/BlackLabel/7fx6jdnw/
answered Nov 14 at 10:38
ppotaczek
3,506129
answered Nov 14 at 10:38
ppotaczek
3,506129
answered Nov 14 at 10:38
ppotaczek
3,506129
answered Nov 14 at 10:38
ppotaczek
3,506129
3,506129
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53292258%2freverse-one-chart-and-leave-the-other-unreversed-synchronized-highcharts%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Generally you configure only one chart, the reason your configuration options apply to all of them is because you are creating 3 charts with the same code, starting here ` activity.datasets.forEach(function (dataset, i) {
. There are many ways to mitigate this, for example you could useif` logic, and match on some element of the chart you want reversed. You could remove the loop and copy the code as many times as you have charts, then you could edit each chart before it is created. Or you could make an id for the charts that you later select and apply options to.– ewolden
Nov 14 at 7:58