You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

60 lines
1.8 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>需要提前准备好的封装到PPT或WORD中的ECharts数据统计图</title>
</head>
<body>
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
<div id="main" style="width:560px; height:270px;"></div>
<!--引入jquery.js-->
<script src="/FengHuang/js/jquery-1.12.4.min.js"></script>
<!-- 引入 echarts.js -->
<script src="/FengHuang/js/echarts/echarts.min.js"></script>
<script type="text/javascript">
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
var option = {
title: {
text: 'ECharts 集成到PPT里的图片'
},
animation: false, // 关闭动画效果
tooltip: {},
legend: {
data: ['销量']
},
xAxis: {
data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
},
yAxis: {},
series: [{
name: '销量',
type: 'bar',
data: [5, 20, 36, 10, 10, 20]
}]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
/**
page.evaluate --> echarts的下载功能是postImage??
* ajax传输图片信息.
*/
function postImage() {
// 向后台发起请求保存图片到指定目录.
$.ajax({
type: 'POST',
url: '/FengHuang/saveEcharts', //黄海封装的保存图片功能
data: {picInfo: myChart.getDataURL()},
success: function () {
console.log('通过post请求传输数据成功!');
}
});
}
</script>
</body>
</html>