Я создаю гистограмму с помощью High Графики - Я хочу экспорта хорошо сформирован график для PNG изображений, я могу применить все нужный стиль для экспорта, но Я не могу применять стиль на этикетках серийных данных при экспорте - Я хочу, чтобы они имели уменьшенный размер шрифта на экспортированном изображении.экспорта Highchart не применяя стиль (размер шрифта) на данной серию этикетки
Я вставив код здесь, но как-то кнопки/экспорт ссылка не отображается на графике ниже
Prompt помощь будет высоко оценена.
Highcharts.chart('container', {
navigation: {
menuStyle: {
background: '#E0E0E0'
},
buttonOptions: {
theme: {
style: {
cursor: 'pointer',
color: '#039',
textDecoration: 'underline'
},
states: {
hover: {
fill: 'white' //'#a4edba'
},
select: {
stroke: '#039',
fill: 'white'
}
}
}
}
},
exporting: {
buttons: {
contextButton: {
enabled: false
},
exportButton: {
text: 'Download', //'<span class="glyphicon glyphicon-download-alt"></span>',
menuItems: [{
textKey: 'downloadPNG',
onclick: function() {
this.exportChart();
}
}, {
textKey: 'downloadJPEG',
onclick: function() {
this.exportChart({
type: 'image/jpeg'
});
}
}]
},
},
enabled: true,
filename: 'Industry Data Set',
sourceWidth: 380,
sourceHeight: 300,
chartOptions: { // specific options for the exported image
legend: {
enabled: false,
},
plotOptions: {
series: {
pointWidth: 10,
groupPadding: 0,
dataLabels: {
enable: true,
style: {
fontSize: "10px",
fontWeight: "normal"
}
}
},
},
xAxis: {
//lineWidth: 1,
labels: {
rotate: -45,
enabled: true,
//format: "{value:.0f}",
style: {
fontSize: "6px",
fontFamily: "Arial"
}
},
},
yAxis: {
lineWidth: 1,
title: {
text: "Count",
style: {
fontFamily: "Arial",
fontSize: "8px",
}
},
labels: {
//rotate: -45,
enabled: true,
format: "{value:.0f}",
style: {
fontSize: "6px",
fontFamily: "Arial"
}
},
gridLineWidth: 0
},
},
//scale: 2,
fallbackToExportServer: false
}, // Exporting End
credits: {
enabled: false
},
colors: ['#00Aeef', '#f4b213', '#9cc84b', '#2bc4b6', '#8d64aa', '#0a3f6b', '#aa5019'],
chart: {
type: 'column'
},
title: {
text: 'Industries'
},
xAxis: {
type: 'category',
lineWidth: 1,
tickWidth: 0,
title: {
text: "",
style: {
fontFamily: "Arial"
}
}
},
yAxis: {
lineWidth: 1,
title: {
text: "Count",
style: {
fontFamily: "Arial"
}
},
gridLineWidth: 0,
labels: {
enabled: true,
format: "{value:.0f}",
style: {
fontSize: "8px",
fontFamily: "Arial"
}
},
startOnTick: true,
endOnTick: true
},
legend: {
enabled: false
},
tooltip: {
pointFormat: 'Count <b>{point.y}</b>'
},
plotOptions: {
series: {
pointWidth: 20,
groupPadding: 0,
}
},
series: [{
name: 'Population',
data: [
['Shanghai', 23.7],
['Lagos', 16.1],
['Istanbul', 14.2],
['Karachi', 14.0],
['Mumbai', 12.5],
['Moscow', 12.1],
['São Paulo', 11.8],
['Beijing', 11.7],
['Guangzhou', 11.1],
['Delhi', 11.1],
['Shenzhen', 10.5],
['Seoul', 10.4],
['Jakarta', 10.0],
['Kinshasa', 9.3],
['Tianjin', 9.3],
['Tokyo', 9.0],
['Cairo', 8.9],
['Dhaka', 8.9],
['Mexico City', 8.9],
['Lima', 8.9]
],
dataLabels: {
rotation: -90,
y: -17,
align: "center",
enabled: true,
borderColor: "",
style: {
fontSize: "10px",
fontWeight: 'normal',
fontFamily: "Arial",
textShadow: false
}
}
}]
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container" style="min-width: 300px; height: 470px; margin: 0 auto"></div>
morangree: Спасибо за поддержку. В то время как ваши исправления хорошо работает на JSFiddle, но не на реальный файл .js в моем проекте Пожалуйста, найти образец рисунок здесь [ссылка] (https://mxhqkq-dm2306.files.1drv.com/y3p7BPUodSbkFc48Lga7YFChKPvVj6h6RRn61k7dj9YzbG-EK8DdEanEJUpiuiaVEn5_-yO19ifNa8DtbJydizPrEBarEHbqoanOOjc_Ls58sSL2wzmOiB7N46FfyQcmAQymVHw9Yf_K47r3Gik- ud0qg/Not% 20Working% 20Sample.gif? psid = 1) – Bhupendra
Какую версию Highcharts вы используете? – morganfree
Я использую Highcharts JS v4.2.5 (2016-05-06) – Bhupendra