javascript - Create four chart with same data different rendering(HIGHCHARTS) -


please need , need create 4 chart same data different rendering , how can please ?

here highcharts code,

    var chart;         chart = new highcharts.chart({             chart: {                 renderto: 'tv_chart_container',                  type: 'area',                 backgroundcolor: '#1e2229',                 //#1e2a38                 marginright: 10,                 panning:true,                 mapnavigation: {               buttons: {                 zoomin: {                     // lower value, greater zoom in                     onclick: function () { this.mapzoom(0.1); }                 },                 zoomout: {                     // higher value, greater zoom out                     onclick: function () { this.mapzoom(10); }                 }               }               //enablebuttons: false             },             credits: {       enabled: false   },             title: {                 text: '',             },             xaxis: {                 type: 'datetime',                 crosshair: {                     color: '#335a81',                     label: {                         enabled: true,                         padding: 8,                         format: '{value: %h:%m:%s}'                     }                 },                 mintickinterval: 1000 * 60, //one minute                  gridlinewidth: 0.1,                 plotlines: [{                 value: pur_time, // value of line appear                 width: 2 ,                 color: '#656568',                 dashstyle: 'dash',                 id: 'plotline',                 label: {                           text: 'purchase deadline',                           verticalalign: 'top',                           textalign: 'center',                           rotation: 270,                           x: -5,                           y: 50,                           style: {                             color: '#656568',                             fontweight: 'bold'                           }                         }             },{                 value: exp_time, // value of line appear                 width: 2 ,                 color: '#a28f29',                 id: 'plotline1',                 label: {                           text: 'expiration time',                           verticalalign: 'top',                           textalign: 'center',                           rotation: 270,                           x: -5,                           y: 50,                           style: {                             color: '#686a3b',                             fontweight: 'bold'                           }                         }             }]             },             yaxis: {                  title: {                       text: '',                  },                 opposite: true,                 crosshair: {                   color: '#335a81',                     label: {                         enabled: true,                         format: '{value:.2f}'                     }                 },                 gridlinewidth: 0.1,                 labels: {                     align: 'right',                     x: 10                 },                  opposite: true,                 minorgridlinewidth: 0,              },              tooltip: { enabled: false },             legend: {                 enabled: false             },             plotoptions: {                 series: {                     enablemousetracking: true                 },                 area: {                     fillcolor: {                         lineargradient: {                             x1: 0,                             y1: 0,                             x2: 0,                             y2: 1                         },                         stops: [                             [0, highcharts.getoptions().colors[0]],                             [1, highcharts.color(highcharts.getoptions().colors[0]).setopacity(0).get('rgba')]                         ]                     },                     linewidth: 1,                     states: {                         hover: {                             linewidth: 1                         }                     },                     threshold: null,                     marker: {                       enabled: false                     }                 }             },             exporting: {                 enabled: false             },             series: [{                 name: 'random data',                 type: 'area',                 color: '#0ab9f1',                 data: (function() {                     // generate array of random data                     var data = [],                         time = (new date()).gettime(),                         i;                      (i = -999; <= 0; i++) {                         data.push([                             time + * 6000,                             math.random()*100,                             math.random()*100,                             math.random()*100,                             math.random()*100                             ]);                     }                     return data;                 })()},{data:[{ x:14654694989093 , y: 50,y: 52,y: 56,y: 57}], color: 'rgba(0,0,0,0)',enablemousetracking:true}]          }); 

i have 4 different id rendering chart same data


Comments

Popular posts from this blog

sql - invalid in the select list because it is not contained in either an aggregate function -

Angularjs unit testing - ng-disabled not working when adding text to textarea -

How to start daemon on android by adb -