Current filter:
                                You should refresh the page.
                                  • Hi,

                                    I came across an issue I can't seem to shake. It is required that I set a custom maximum value to the 'YY' axis of a chart I use but the definition of the wholeRange/valueRange on the object doesn't seem to set it correctly. I annexed a snapshot of the resulting chart. Currently my code looks like this:


                                    valueAxis: {
                                                    wholeRange: [0, UsageChartHighValue]
                                                    ,constantLines: [
                                                    {
                                                        width: 1,
                                                        value: median,
                                                        color: "#7A0000",
                                                        dashStyle: "dash"
                                                    }]
                                                }


                                    Can youtell what I'm doing wrong?

                                    Thanks.

                                1 Solution

                                Creation Date Importance Sort by

                                Hello,
                                I suggest that you are using the visualRange option instead. The wholeRange option sets range for data and where Chart can be zoomed and panned. I look forward to your results.

                                UPDATED:

                                Let me jump into this conversation. As far as I can see, the main issue is that you do not see the "UsageChartHighValue" value on your Y axis, but you see "3.5", isn't it? Unfortunately, at this moment, the value axis doesn't provide a functionality to show the value of a visual range's "endValue" option if it is not a multiple of tickInterval. For example. if in Vova's sample you set the "endValue" option to 11, you still will see 10 in the value axis. 
                                It is in our future plans to support this functionality. At the moment, you can calculate tickInterval's value in order to show your "UsageChartHighValue" or 
                                you can add another constant line with a value equal to your "UsageChartHighValue". I've modified Vova's sample to demonstrate this idea:
                                https://codepen.io/anon/pen/jQXReE?editors=0010


                                Let me know if it meets your needs.

                                Show all comments
                                • Rúben Ferreira 11.28.2018
                                  Hi Lena,

                                  I tried both options and got the same result. This var - UsageChartHighValue - represents the value I calculate and want the Y axis to go up to but it always ignores it and sticks by the automatic calculation regarding the values present in the chart.

                                • Alessandro (DevExpress Support) 11.28.2018
                                  Hi,

                                  Since this feature is available starting with the latest version of our components (18.2), please make sure that you are using this version. See also: DevExtreme Charts - Improved Zooming and Scrolling (v18.2). In addition, you might need to use the following options to adjust the visual range more precisely: valueMarginsEnabledendOnTick.
                                • Rúben Ferreira 11.29.2018
                                  Hi Alessandro,

                                  I'm using the 17.2.6 version at the moment. Is there no alternative for any version lower than 18.2?

                                • Alessandro (DevExpress Support) 11.29.2018
                                  Hi,

                                  This functionality is not available in old versions of our components and there is no alternative approach. The only possible solution is to perform an upgrade.  Generally, it is sufficient to follow instructions from the Migrate to the New Version help section to perform an upgrade smoothly. In addition, you might take into account the conceptual  Breaking Changes described in our website. This information might be important if your application uses features affected by breaking changes. If you did not use any non-official (non-documented) API, you should not experience difficulties during the upgrade process. Please feel free to post a sample project if you encounter any difficulties. We will do our best to address them, so that you can continue your development by using our components. We greatly appreciate your time and cooperation.
                                • Alessandro (DevExpress Support) 11.29.2018
                                  Hi,

                                  Having examined this scenario further, we concluded that as an alternative solution in the previous version, it is possible to use the min / max options to specify the required visual range. You might also need to disable the valueMarginsEnabled and endOnTick options so that the required data points fit the visual area.

                                • Rúben Ferreira 11.29.2018
                                  Hey,

                                  I went ahead and updated my DevExpress/Extreme to 18.2.3 in the meantime and tried the fixes again to no avail. Here's my full chart definition as of now:

                                  [JavaScript]
                                  var USLChart2 = $("#UsageLineChart2").dxChart({ dataSource: USLarr, commonSeriesSettings: { argumentField: "xCoord" }, size: {height:400}, "export": { enabled: true }, valueAxis: { visualRange: { startValue: 0, endValue: UsageChartHighValue } ,constantLines: [ { width: 1, value: median, color: "#7A0000", dashStyle: "dash" }] ,title: '@Resources.Global.Grams'+" / "+'@Resources.Global.Box' }, series: [{ valueField: "yCoord", type: "line", color: "#000080", point:{size:6} } ,{ valueField: "lowTarget", name: "", type: "stackedarea", color: "#FFFFFF00" }, { valueField: "highTarget", name: "", type: "stackedarea", color: "#228B22" , hoverMode: 'none',selectionMode: 'none', point:{visible:false, hoverMode:'none'} } ], title: { text: '@Resources.Global.ThousandBoxAverageApplicationWeight' ,font: { size: 16, family: "Lato" } }, legend: { visible: false } ,tooltip: { enabled: true, location: "edge", customizeTooltip: function (arg) { if(arg.point.series.type == 'line'){ return { text: arg.valueText }; } else return { text: null }; } } });

                                  Am I missing somehing?
                                • Vova (DevExpress Support) 11.29.2018

                                  Hello Rúben,

                                  I have created a sample project based on your code: https://codepen.io/VovaDX/pen/PxXbPo?editors=0010. I set the constant value instead of the UsageChartHighValue and median variables and this chart seems to be displayed correctly. Am I right? If so, please modify my sample to reproduce this issue and provide me with a screenshot demonstrating the desired behavior. You can easily modify my CodePen project and click the "Fork" button to create your own copy of my project.

                                  Regards,
                                  Vova

                                • Rúben Ferreira 11.30.2018
                                  Hi Vova,

                                  I tried these approaches so far:

                                  - Taking off the 'height' limitation
                                  - Changing the structure of the 'datetime' objects passed to the XX axis
                                  - straight up copying the code on your sample to my project and running it
                                  - hardcoding the max value I want on

                                  None of them have rendered the result I want. For some reason the YY axis fails to display the max value I intend it to.

                                • Paul V (DevExpress Support) 11.30.2018

                                  Hello Rúben,

                                  Let me jump into this conversation. As far as I can see, the main issue is that you do not see the "UsageChartHighValue" value on your Y axis, but you see "3.5", isn't it? Unfortunately, at this moment, the value axis doesn't provide a functionality to show the value of a visual range's "endValue" option if it is not a multiple of tickInterval. For example. if in Vova's sample you set the "endValue" option to 11, you still will see 10 in the value axis.
                                  It is in our future plans to support this functionality. At the moment, you can calculate tickInterval's value in order to show your "UsageChartHighValue" or  
                                  you can add another constant line with a value equal to your "UsageChartHighValue". I've modified Vova's sample to demonstrate this idea:
                                  https://codepen.io/anon/pen/jQXReE?editors=0010


                                  Let me know if it meets your needs.
                                • Rúben Ferreira 12.03.2018
                                  Hi Paul,

                                  I tried both suggestions (tickInterval + new constant line) and both failed to yeild any new result. I even tried to change some data in the example you provided and while it works perfectly there, it fails to do so on my project.

                                • Paul V (DevExpress Support) 12.04.2018

                                  Hello Rúben,

                                  It's hard to provide you with a solution without reproducing the issue on our side. It may probably occur due to external factors that are present in your project only since it cannot be reproduced in my sample. Please send us a runnable version of your sample, so we can reproduce the issue locally. This way, we can analyze and debug it locally.

                                • Rúben Ferreira 12.07.2018
                                  Hey Paul,

                                  The scope of the project I'm working on is simply too big to share it here. On that note I'd like to try a different approach: is possible to obtain the maximum value the valueAxis will display after the chart is constructed? If it's possible that could help me achieve what I'm after.

                                • Marina (DevExpress Support) 12.10.2018
                                  Hi, 

                                  We need some time to research your question. Please bear with us. We will answer as soon as possible. 
                                • Rúben Ferreira 12.11.2018
                                  Hi,

                                  While trying something new yesterday, I finally figured out a solution. For some reason the div element I had my graph inserted into kept cutting off the superior part of it no matter what so when I forced a smaller fixed height in the graph's settings, the upper bar suggested above appeared. I found it really weird since I hadn't established any fixed measures in my css for this specific reason but it turns out that was what was causing the issue.

                                  Thank you all for your help and patience.

                                • Marina (DevExpress Support) 12.11.2018
                                  Hi, 

                                  I am happy to know that the issue is resolved! Feel free to ask additional questions.