About the use of Highstock plug-in experience

Recently in a background management system, which has a statistical analysis module, the use of the chart plugin Highstock.js

About the configuration on the official website also viewed for a long time, this is my package good JS

Highcharts.setoptions ({
Global: {
Useutc:false
}
});

var linestock= (function ($) {

_this={};
_this.drawline=function (Tipname,dateformat,linedata) {
$ (' #dateLineChart '). Highcharts (' Stockchart ', {
Colors: [' #61C6CF '],

Rangeselector: {

Enabled:false

},

Title: {

Text: '

},

Series: [{

Name:tipname,

Data:linedata,

ToolTip: {

valuedecimals:0,

Xdateformat:dateformat

},

Marker: {

Enabled:true,

FillColor: "#FFF",

Radius:3,

Linewidth:1,

LineColor: "#61C6CF"

}

}],

navigation:{

buttonoptions:{

Enabled:false

}

},

navigator:{

Enabled:false,

Adapttoupdateddata:false,

Maskinside:false

},

yaxis:{

Gridlinewidth:1,

Linewidth:1

},

xaxis:{

tickwidth:0,//If you do not add a scale of 0, your browser will have a blank tick

Formatter:function () {

var vdate = new Date (this.value);

Return (Vdate.getmonth () + 1) + "-" + vdate.getdate ();

},

Minortickinterval: ' Auto ',

Linewidth:1,

Tickwidth:1

},

credits:{

Enabled:false

},

exporting:{

Enabled:false

},

Legend: {

Layout: ' Vertical ',

Align: ' right ',

VerticalAlign: ' Middle ',

borderwidth:0

},

Date Selection Range

Rangeselector: {

The Zoom selection button is an array.

Where type can be: ' Millisecond ', ' second ', ' minute ', ' Day ', ' Week ',

' Month ', ' YTD ' (year to date), ' Year ' and ' all '.

Where count refers to the number of units type.

Where text is configured to display text on the button

Buttons: [{

Type: ' Month ',

Count:1,

Text: ' January '

}, {

Type: ' Month ',

Count:3,

Text: ' March '

}, {

Type: ' Month ',

Count:6,

Text: ' June '

}, {

Type: ' Year ',

Count:1,

Text: ' 1 years '

}, {

Type: ' Year ',

Count:3,

Text: ' 3 years '

}, {

Type: ' All ',

Text: ' All '

} ],

Default selection field: 0 (First in the Zoom button), 1 (second in the Zoom button) ...

selected:0,

Allow input label marquee

Inputenabled:false,

Inputdateformat: '%y-%m-%d ',

Buttontheme: {//styles for the buttons

Fill: ' None ',

Stroke: ' None ',

' Stroke-width ': 0,

R:8,

Style: {

Color: ' #039 ',

Color: ' #048ee9 ',

FontWeight: ' Bold ',

Display: ' None '

},

States: {

Hover: {},

Select: {

Fill: ' #039 ',

Fill: ' #048ee9 ',

Style: {

Color: ' White '

}

}

}

},

Inputboxbordercolor: ' Gray ',

Inputboxbordercolor: ' #b4caf2 ',

INPUTBOXWIDTH:120,

Inputboxheight:18,

Inputstyle: {

Color: ' #039 ',

Color: ' #048ee9 ',

Color: ' #b4caf2 ',

FontWeight: ' Bold '

},

LabelStyle: {

Color: ' #b4caf2 ',

FontWeight: ' Bold ',

Display: ' None '

}

}

});

};

return _this;

}) (JQuery);

About the use of Highstock plug-in experience