Novice must See "Highcharts's 100 basic questions and Answers

Source: Internet
Author: User

Novice must See "Highcharts's 100 basic questions and Answers

2014-12-2 10:59| Published by: Mr.zhang| View: 2749| Reviews: 3| From: Highcharts Chinese Forum

Summary: 1, how to remove the highcharts.com in the chart? Answer: By setting Credits.eneable = False, that is credits: {Enabled:false}

In order to facilitate the explanation, first put out the highcharts main components of the illustration

Figure 1:highcharts Main components

The name explained in the figure:

    • Title & SubTitle Chart titles and subtitles
    • Exporting Chart Export Function button
    • ToolTip Data Tip Box
    • Xaxis, YAxis x, Y axis
    • Series data series
    • Legend legend
    • Credits Copyright label

 1, how to remove the highcharts.com in the chart?     Answer:By setting credits.enabled= false, that is credits: {Enabled:false} In addition, the text and connections are customizable, see APIcredits2, how to increase the export function (or display the export button)?  Answer:By introducing Exporting.js, you can add the export function to the chart, that is, adding the following code, if you do not want to export the function, do not introduce exporting.js, in addition, disable the Export function by setting exporting.enabled = False, See APIexporting.enabled3, how to remove the Legend (legend)? Answer:Set legend.enable = False, i.e. legend: {enabled:false} pie chart needs to be setPlotOptions.pie.showInLegend= True to display the legend.4. How to set the chart color     1) The most basic chart lines (or bars, etc.) are set by colors, i.e. colors: [' #7cb5ec ', ' #434348 ', ' #90ed7d ', ' #f7a35c ', ' #8085e9 ', ' #f15c80 ', ' #e4d354 ', ' #8085e8 ', ' #8d4653 ', ' #91e8e1 ']   where the color value and the number can be fully customized 2) define the color of a point by settingSeries.data.colorTo achieve a custom color for a point, the instance effect is as follows 3) for the histogram of a single series of different column color customization, in addition to setting colors, additional settings are requiredPlotOptions.column.colorByPoint= True, other types of graphs have similar reference posts:http://bbs.hcharts.cn/thread-491-1-2.html 5, how to translate the English in the chart (shown in Chinese)? Please check the post:http://bbs.hcharts.cn/thread-70-1-1.htmlThat is, the lang attribute is set to the display of the text in the chart, that is, all the text in the chart can be modified by this property.

Instance code:

Highcharts.setoptions ({

lang:{

Contextbuttontitle: "Chart export Menu",

Decimalpoint: ".",

Downloadjpeg: "Download JPEG image",

Downloadpdf: "Download PDF file",

Downloadpng: "Download png file",

Downloadsvg: "Download svg file",

Drilluptext: "Return {series.name}",

Loading: "Loading in",

months:["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December",

NoData: "No Data",

Numericsymbols: ["Thousand", "Mega", "G", "T", "P", "E"],

Printchart: "Print Chart",

Resetzoom: "Restore Zoom",

Resetzoomtitle: "Restore Chart",

Shortmonths: ["Jan", "Feb", "Mar", "APR", "may", "June", "Jul", "April", "Sep", "Oct", "Nov", "Dec"].

THOUSANDSSEP: ",",

Weekdays: ["Monday", "Tuesday", "Wednesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"].

}

});

$ ("#container"). Highcharts ({

Highcharts Code

});

Note:Highcharts.setoptions ({}) belongs to the global configuration, and the code is placed outside of $ ("#container"). Highcharts ({}).6. How do I get rid of legend click events? That is, how to make the Click Legend (Legend) do not hide the corresponding sequence (series), the Setup code is: plotoptions: {Series: {events: {Legenditemclic  K:function (event) {return false; return False to disable LEGENDITEML to prevent the Hidden Series}}} from being clicked by clicking on item to display the reference instance:http://www.hcharts.cn/demo/index.php?p=927. How do I hide a line (or sequence series) at initialization time?  The corresponding effect is

That is, by default, one or more lines are hidden, and the implementation code is

Series: [{

Data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],

visible:false//does not display by default

}, {

Data: [144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2],

}]

This code is from an online demo: Show and hide data columns by clicking Legend

Then the question came, the eyes of a good little friend again have doubts, "visible" this property is not in the API, why you can do so?

A: "The attributes that are not in the API are used in the example, what does this mean?" "

"You're a dictionary,"!-_-.

Novice must See "Highcharts's 100 basic questions and Answers

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.