Conditional Chart area fill in amCharts - amStockCharts












0














I want to display a graph very similar to below tradingView chart in amCharts. The problem is how can I fill the area between two specific line graphs with different fill color depending on which line graph is above the other.



enter image description here



Using fillToGraph will always fill the same color regardless of whether that graph is below or above the another graph and ends up mixing both the colors as shown below.
enter image description here



I am using amCharts v3.

Please help.










share|improve this question
























  • You'll need to specify your own colors in your data with fillColorsField for instances where the values intersect and provide your own color. Note that you will need to disable data grouping to use fillColorsField
    – xorspark
    Nov 26 '18 at 20:09












  • Or you can fill your graphs using fillAlphas. The drawback of it is that it also fills the areas when your graphs union. See my answer: stackoverflow.com/a/52955797/2410655
    – David Liang
    Nov 27 '18 at 0:38










  • @DavidLiang My aim is to fill area bwtween two graphs with red when the red line is above green one and fill with green when green is above red. As Iin the second picture, fillAlphas goes both way when used with fillToGraph and the result is a mix of green and red shades.
    – KCK
    Nov 27 '18 at 8:01










  • @xorspark I want to group data while displaying. was just wondering the use of "useDatasetColors". Is that something relevant here?
    – KCK
    Nov 27 '18 at 8:02










  • Not really. It lets you override the color locally through fillColors/lineColor but it doesn't let you control what fill is used for each point. For that you still need fillColorsField and disabling data grouping, which will impact performance. My colleague made a serial chart solution a while back using fillColorsField through the init handler here that illustrates the how it can work. It can be adapted to the stock chart with some tweaking.
    – xorspark
    Nov 27 '18 at 11:43
















0














I want to display a graph very similar to below tradingView chart in amCharts. The problem is how can I fill the area between two specific line graphs with different fill color depending on which line graph is above the other.



enter image description here



Using fillToGraph will always fill the same color regardless of whether that graph is below or above the another graph and ends up mixing both the colors as shown below.
enter image description here



I am using amCharts v3.

Please help.










share|improve this question
























  • You'll need to specify your own colors in your data with fillColorsField for instances where the values intersect and provide your own color. Note that you will need to disable data grouping to use fillColorsField
    – xorspark
    Nov 26 '18 at 20:09












  • Or you can fill your graphs using fillAlphas. The drawback of it is that it also fills the areas when your graphs union. See my answer: stackoverflow.com/a/52955797/2410655
    – David Liang
    Nov 27 '18 at 0:38










  • @DavidLiang My aim is to fill area bwtween two graphs with red when the red line is above green one and fill with green when green is above red. As Iin the second picture, fillAlphas goes both way when used with fillToGraph and the result is a mix of green and red shades.
    – KCK
    Nov 27 '18 at 8:01










  • @xorspark I want to group data while displaying. was just wondering the use of "useDatasetColors". Is that something relevant here?
    – KCK
    Nov 27 '18 at 8:02










  • Not really. It lets you override the color locally through fillColors/lineColor but it doesn't let you control what fill is used for each point. For that you still need fillColorsField and disabling data grouping, which will impact performance. My colleague made a serial chart solution a while back using fillColorsField through the init handler here that illustrates the how it can work. It can be adapted to the stock chart with some tweaking.
    – xorspark
    Nov 27 '18 at 11:43














0












0








0







I want to display a graph very similar to below tradingView chart in amCharts. The problem is how can I fill the area between two specific line graphs with different fill color depending on which line graph is above the other.



enter image description here



Using fillToGraph will always fill the same color regardless of whether that graph is below or above the another graph and ends up mixing both the colors as shown below.
enter image description here



I am using amCharts v3.

Please help.










share|improve this question















I want to display a graph very similar to below tradingView chart in amCharts. The problem is how can I fill the area between two specific line graphs with different fill color depending on which line graph is above the other.



enter image description here



Using fillToGraph will always fill the same color regardless of whether that graph is below or above the another graph and ends up mixing both the colors as shown below.
enter image description here



I am using amCharts v3.

Please help.







graph amcharts amstock






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 24 '18 at 14:14

























asked Nov 23 '18 at 12:32









KCK

1,2331516




1,2331516












  • You'll need to specify your own colors in your data with fillColorsField for instances where the values intersect and provide your own color. Note that you will need to disable data grouping to use fillColorsField
    – xorspark
    Nov 26 '18 at 20:09












  • Or you can fill your graphs using fillAlphas. The drawback of it is that it also fills the areas when your graphs union. See my answer: stackoverflow.com/a/52955797/2410655
    – David Liang
    Nov 27 '18 at 0:38










  • @DavidLiang My aim is to fill area bwtween two graphs with red when the red line is above green one and fill with green when green is above red. As Iin the second picture, fillAlphas goes both way when used with fillToGraph and the result is a mix of green and red shades.
    – KCK
    Nov 27 '18 at 8:01










  • @xorspark I want to group data while displaying. was just wondering the use of "useDatasetColors". Is that something relevant here?
    – KCK
    Nov 27 '18 at 8:02










  • Not really. It lets you override the color locally through fillColors/lineColor but it doesn't let you control what fill is used for each point. For that you still need fillColorsField and disabling data grouping, which will impact performance. My colleague made a serial chart solution a while back using fillColorsField through the init handler here that illustrates the how it can work. It can be adapted to the stock chart with some tweaking.
    – xorspark
    Nov 27 '18 at 11:43


















  • You'll need to specify your own colors in your data with fillColorsField for instances where the values intersect and provide your own color. Note that you will need to disable data grouping to use fillColorsField
    – xorspark
    Nov 26 '18 at 20:09












  • Or you can fill your graphs using fillAlphas. The drawback of it is that it also fills the areas when your graphs union. See my answer: stackoverflow.com/a/52955797/2410655
    – David Liang
    Nov 27 '18 at 0:38










  • @DavidLiang My aim is to fill area bwtween two graphs with red when the red line is above green one and fill with green when green is above red. As Iin the second picture, fillAlphas goes both way when used with fillToGraph and the result is a mix of green and red shades.
    – KCK
    Nov 27 '18 at 8:01










  • @xorspark I want to group data while displaying. was just wondering the use of "useDatasetColors". Is that something relevant here?
    – KCK
    Nov 27 '18 at 8:02










  • Not really. It lets you override the color locally through fillColors/lineColor but it doesn't let you control what fill is used for each point. For that you still need fillColorsField and disabling data grouping, which will impact performance. My colleague made a serial chart solution a while back using fillColorsField through the init handler here that illustrates the how it can work. It can be adapted to the stock chart with some tweaking.
    – xorspark
    Nov 27 '18 at 11:43
















You'll need to specify your own colors in your data with fillColorsField for instances where the values intersect and provide your own color. Note that you will need to disable data grouping to use fillColorsField
– xorspark
Nov 26 '18 at 20:09






You'll need to specify your own colors in your data with fillColorsField for instances where the values intersect and provide your own color. Note that you will need to disable data grouping to use fillColorsField
– xorspark
Nov 26 '18 at 20:09














Or you can fill your graphs using fillAlphas. The drawback of it is that it also fills the areas when your graphs union. See my answer: stackoverflow.com/a/52955797/2410655
– David Liang
Nov 27 '18 at 0:38




Or you can fill your graphs using fillAlphas. The drawback of it is that it also fills the areas when your graphs union. See my answer: stackoverflow.com/a/52955797/2410655
– David Liang
Nov 27 '18 at 0:38












@DavidLiang My aim is to fill area bwtween two graphs with red when the red line is above green one and fill with green when green is above red. As Iin the second picture, fillAlphas goes both way when used with fillToGraph and the result is a mix of green and red shades.
– KCK
Nov 27 '18 at 8:01




@DavidLiang My aim is to fill area bwtween two graphs with red when the red line is above green one and fill with green when green is above red. As Iin the second picture, fillAlphas goes both way when used with fillToGraph and the result is a mix of green and red shades.
– KCK
Nov 27 '18 at 8:01












@xorspark I want to group data while displaying. was just wondering the use of "useDatasetColors". Is that something relevant here?
– KCK
Nov 27 '18 at 8:02




@xorspark I want to group data while displaying. was just wondering the use of "useDatasetColors". Is that something relevant here?
– KCK
Nov 27 '18 at 8:02












Not really. It lets you override the color locally through fillColors/lineColor but it doesn't let you control what fill is used for each point. For that you still need fillColorsField and disabling data grouping, which will impact performance. My colleague made a serial chart solution a while back using fillColorsField through the init handler here that illustrates the how it can work. It can be adapted to the stock chart with some tweaking.
– xorspark
Nov 27 '18 at 11:43




Not really. It lets you override the color locally through fillColors/lineColor but it doesn't let you control what fill is used for each point. For that you still need fillColorsField and disabling data grouping, which will impact performance. My colleague made a serial chart solution a while back using fillColorsField through the init handler here that illustrates the how it can work. It can be adapted to the stock chart with some tweaking.
– xorspark
Nov 27 '18 at 11:43

















active

oldest

votes











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














draft saved

draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53446791%2fconditional-chart-area-fill-in-amcharts-amstockcharts%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown






























active

oldest

votes













active

oldest

votes









active

oldest

votes






active

oldest

votes
















draft saved

draft discarded




















































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.




draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53446791%2fconditional-chart-area-fill-in-amcharts-amstockcharts%23new-answer', 'question_page');
}
);

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







Popular posts from this blog

Lallio

Futebolista

Jornalista