Как добавить линию тренда

Как добавить линию тренда

Это код графа высокой диаграммы.

<!DOCTYPE HTML> <html>     <head>         <meta http-equiv="Content-Type" content="text/html; charset=utf-8">         <title>Highcharts Example</title>          <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>         <script type="text/javascript"> $(function () {         $('#container').highcharts({             title: {                 text: 'RNA',                 x: -20 //center             },             subtitle: {                 text: 'Outage Reasons',                 x: -20             },             xAxis: {                 categories: ['18-Jul-14', '19-Jul-14', '20-Jul-14', '21-Jul-14', '22-Jul-14', '23-Jul-14',                     '24-Jul-14', '25-Jul-14', '26-Jul-14', '27-Jul-14', '28-Jul-14', '29-Jul-14']             },             yAxis: {                 title: {                     text: 'Outage'                 },                 plotLines: [{                     value: 0,                     width: 1,                     color: '#808080'                 }]             },             tooltip: {                 valueSuffix: ''             },             legend: {                 layout: 'vertical',                 align: 'right',                 verticalAlign: 'middle',                 borderWidth: 0             },             series: [{                 name: 'RNA - CP ( Radio Network Availability - Customer Perceived)',                 data: [99.75, 99.77, 99.78, 99.84, 99.82, 99.82, 99.76, 99.78, 99.8, 99.65, 99.94, 99.8]             }],             credits: {                 enabled: false             }         });     });           </script>     </head>     <body> <script src="highcharts.js"></script> <script src="exporting.js"></script>  <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>      </body> </html> 

Я хочу , чтобы добавить линию тренда на этом графике, я искал в Google и получил код по этой ссылке: https://github.com/virtualstaticvoid/highcharts_trendline и я добавил код линии тренда , как это.

<!DOCTYPE HTML> <html>     <head>         <meta http-equiv="Content-Type" content="text/html; charset=utf-8">         <title>Highcharts Example</title>          <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>           <script type="text/javascript" src="regression.js"></script>            <script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>           <script type="text/javascript"> $(function () {         $('#container').highcharts({             title: {                 text: 'RNA',                 x: -20 //center             },             subtitle: {                 text: 'Outage Reasons',                 x: -20             },             xAxis: {                 categories: ['18-Jul-14', '19-Jul-14', '20-Jul-14', '21-Jul-14', '22-Jul-14', '23-Jul-14',                     '24-Jul-14', '25-Jul-14', '26-Jul-14', '27-Jul-14', '28-Jul-14', '29-Jul-14']             },             yAxis: {                 title: {                     text: 'Outage'                 },                 plotLines: [{                     value: 0,                     width: 1,                     color: '#808080'                 }]             },             tooltip: {                 valueSuffix: ''             },             legend: {                 layout: 'vertical',                 align: 'right',                 verticalAlign: 'middle',                 borderWidth: 0             },             series: [{                 name: 'RNA - CP ( Radio Network Availability - Customer Perceived)',                 data: [99.75, 99.77, 99.78, 99.84, 99.82, 99.82, 99.76, 99.78, 99.8, 99.65, 99.94, 99.8]             }],             credits: {                 enabled: false             }         });     });        var sourceData = [           [18-Jul-14, 99.75], [19-Jul-14, 99.77],           [20-Jul-14, 99.78], [21-Jul-14, 99.84],           [22-Jul-14, 99.82], [23-Jul-14, 99.82],           [24-Jul-14, 99.76], [25-Jul-14, 99.78],           [26-Jul-14, 99.8], [27-Jul-14, 99.65],           [28-Jul-14, 99.94], [29-Jul-14, 99.8]       ];        var chart_linear = new highcharts.Chart({           chart: {             renderTo: 'container'           },           plotOptions: {             series: {               enableMouseTracking: false             }           },           series: [{             type: 'scatter',             data: sourceData           },           {             type: 'line',             marker: { enabled: false },             /* function returns data for trend-line */             data: (function() {               return fitData(sourceData).data;             })()           }]       });           </script>     </head>     <body>  <script src="exporting.js"></script>  <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>      </body> </html> 

и линия тренда, которая действует в соответствии со значениями по оси X и оси Y, а по значениям х-оси дата мудрыми и значения у-оси являются числами, пожалуйста, найти снимок экрана для первого кода: введите описание изображения здесь

И эта линия тренда снимок. пожалуйста найди. введите описание изображения здесь

пожалуйста, поделитесь любой из кода, который я хотел бы добавить два графика в одной и той же странице, я попробовал, но значения по оси Х и Y-оси различны для двух графиков.

Благодарю.



Источник: askvoprosy.com


Добавить комментарий