<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>ZingSoft Demo</title> <script nonce="undefined" src="https://cdn.zingchart.com/zingchart.min.js"></script> <style></style> </head> <body> <div id='myChart'></div> <script> ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"]; /*Sets whether monotone interpolation is used for charts using the "spline" aspect. When monotone is set to true the curve of a spline chart is reduced. This allows for more accuracy when ploting lines which are near 0.*/ var myConfig = { type: "line", plot: { aspect: "spline", //monotone:true //set monotone in series:[{},{}] to better show the difference between the true false values. }, legend: { adjustLayout: true, align: "right", verticalAlign: "middle" }, scaleY: { refLine: { lineColor: "red" } }, series: [{ values: [100, 0, 25, -1, 25, 0, 100], monotone: true, text: "monotone: true" //can also be set in plot:{} to apply to all lines in a chart }, { values: [100, 0, 25, -1, 25, 0, 100], monotone: false, text: "monotone: false" //can also be set in plot:{} to apply to all lines in a chart } ] } zingchart.render({ id: 'myChart', data: myConfig, height: 400, width: '100%' }); </script> </body> </html>
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>ZingSoft Demo</title> <script src="https://cdn.zingchart.com/zingchart.min.js"></script> </head> <body> <div id='myChart'></div> </body> </html>
/*Sets whether monotone interpolation is used for charts using the "spline" aspect. When monotone is set to true the curve of a spline chart is reduced. This allows for more accuracy when ploting lines which are near 0.*/ var myConfig = { type: "line", plot: { aspect: "spline", //monotone:true //set monotone in series:[{},{}] to better show the difference between the true false values. }, legend: { adjustLayout: true, align: "right", verticalAlign: "middle" }, scaleY: { refLine: { lineColor: "red" } }, series: [{ values: [100, 0, 25, -1, 25, 0, 100], monotone: true, text: "monotone: true" //can also be set in plot:{} to apply to all lines in a chart }, { values: [100, 0, 25, -1, 25, 0, 100], monotone: false, text: "monotone: false" //can also be set in plot:{} to apply to all lines in a chart } ] } zingchart.render({ id: 'myChart', data: myConfig, height: 400, width: '100%' });