<!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({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
colors:[
'red',//第一個顏色,歡迎加入Highcharts學習交流羣294191384
'blue',//第二個顏色
'yellow',//第三個顏色
'#1aadce', //。。。。
'#492970',
'#f28f43',
'#77a1e5',
'#c42525',
'#a6c96a'
],
title: {
text: 'Browser market shares at a specific website, 2010'
},
tooltip: {
pointFormat: '{series.name}: <
b
>{point.percentage:.1f}%</
b
>'
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
color: '#000000',
connectorColor: '#000000',
format: '<
b
>{point.name}</
b
>: {point.percentage:.1f} %'
}
}
},
series: [{
type: 'pie',
name: 'Browser share',
data: [
['Firefox', 45.0],
['IE', 26.8],
['Opera', 6.2],
]
}]
});
});
</
script
>
</
head
>
<
body
>
<
script
src
=
"http://code.highcharts.com/highcharts.js"
></
script
>
<
div
id
=
"container"
style
=
"min-width: 310px; height: 400px; margin: 0 auto"
></
div
>
</
body
>
</
html
>