Reverse Y axis in ScatterLine- Kendo-UI

不羁岁月 提交于 2019-12-25 06:58:07

问题


I could able to display two scatter lines on the chart. However, I would like to reverse Y axis.

Even though I implemented following line, but it does not work based on the http://www.telerik.com/forums/valueaxis-change-direction-of-y-axis-reverse

valueAxis: {
   reverse: true,
},

http://jsfiddle.net/3yhbyy2g/3/


回答1:


Here is the full solution and jsfiddle:http://jsfiddle.net/3yhbyy2g/9/

The key part of the solution is to approach each axis (x and y). and add reverse:true to the y axis.

            function createChart() {
                $("#chart").kendoChart({
                    title: {
                        text: "Path"
                    },


                    tooltip: {
                      visible: true,
                      format: "Value: {0:N0}",
                    },
                 xAxis: {
                    max: 8000,
                    labels: {
                      format: "{0}m"
                  },
                    title: {
                    text: "Meter"
                }
            },
            yAxis: {
                reverse:true,
                labels: {
                    format: "{0}",
                    padding: { 
                     left: 10 
             }   
                },
                title: {
                    text: "Charge"
                }
            },
                    seriesDefaults: {
                        type: "scatterLine",
                    },
                    series: [{
                        name: "Path1",
                        data: stats,
                        markers: {
                        visible: false
                       }
                     }, {
                        name: "Path2",
                        data: stats2,
                        markers: {
                          visible: false
                        }
                    }],

                });
            }

            $(document).ready(createChart);


来源:https://stackoverflow.com/questions/29687368/reverse-y-axis-in-scatterline-kendo-ui

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!