Highcharts导出服务器配置——PHP版

最新推荐文章于 2024-10-11 07:18:27 发布

oooodboooo

最新推荐文章于 2024-10-11 07:18:27 发布

阅读量2.1k

点赞数 1

分类专栏： Highcharts 文章标签： Highcharts导出服务器配置-ph

Highcharts 专栏收录该内容

2 篇文章

订阅专栏

Highcharts导出服务器配置——PHP版

一、运行环境及准备工作

1、运行环境

Apache+php 环境，相信大家都会搭建，这里就不多说了，如果不会的请安装集成环境软件 WampServer

java运行环境

安装 java 运行环境，不会的请参考本人博客中的“ Java 安装及环境变量配置” http://www.52wulian.org/java_classpath/
2、文件下载

Highcharts

下载地址： http://code.highcharts.com/zips/Highcharts-3.0.7.zip

Batik

下载地址： http://apache.fayea.com/apache-mirror/xmlgraphics/batik
将上述压缩包解压，得到 highcharts3.0.7 和 batik-1.7 目录

二、搭建服务器
1 、在 web 服务（ apache ）根目录新建 export 目录
2 、拷贝 index.php 到 export
index.php 在 highcharts3.0.7\exporting-server\php\php-batik\ 目录下
3 、在 export 目录里新建 temp 目录，并给定可读可写权限， linux 下给定目录 777 权限

Window下设置可读可写的方法如下

Linux设置可读可写命令如下：[mw_shl_codehtml,true]Chmod 777 temp[/mw_shl_code]

4 、拷贝 batik-rasterizer.jar 到 export 目录
   batik-rasterizer.jar 在 batik-1.7 目录下， batik-rasterizer.jar 的引用在 index.php 的 17 行
5 、拷贝 lib 目录到 export 目录
   lib 目录存在 batik-1.7 目录下，注意是拷贝 lib 目录所有内容
   这时候的 export 目录为：

测试 batik 可用的方式是 cmd 中运行 java –jar batik-rasterizer.jar ，如图

6 、修改 Highcharts 的 exporting 属性，指定本地的导出服务地址
[mw_shl_code=javascript,true]exporting :{
   url:'http://localhost/export/index.php',
}[/mw_shl_code]
如果是想所有的图表都使用该地址，可以直接修改 exporting.js

三、测试
编写 Highcharts_exporting.html 文件，内容如下
[mw_shl_code=html,true]<!DOCTYPE HTML>
<html lang="en">
<head>
      <meta charset="UTF-8">
      <title>Highcharts Exporting Server</title>
      <meta name="description" content="Highcharts Exporting Server" />
      <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
      <script type="text/javascript" src="demo/js/highcharts.js"></script>
      <script type="text/javascript" src="demo/js/exporting.js"></script>
      <script>
            $(function () {
         $('#container').highcharts({
            title: {
                  text: 'Monthly Average Temperature',
                  x: -20 //center
            },
            exporting :{
                     url:'http://localhost/export/index.php',
                     width:800
            },
            subtitle: {
                  text: 'Source: WorldClimate.com',
                  x: -20
            },
            xAxis: {
                  categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
            },
            yAxis: {
                  title: {
                     text: 'Temperature (°C)'
                  },
                  plotLines: [{
                     value: 0,
                     width: 1,
                     color: '#808080'
                  }]
            },
            tooltip: {
                  valueSuffix: '°C'
            },
            legend: {
                  layout: 'vertical',
                  align: 'right',
                  verticalAlign: 'middle',
                  borderWidth: 0
            },
            series: [{
                  name: 'Tokyo',
                  data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
            }, {
                  name: 'New York',
                  data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
            }, {
                  name: 'Berlin',
                  data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
            }, {
                  name: 'London',
                  data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
            }]
         });
            });
      </script>
</head>

<body>

      <div id="container" style="min-width:800px;height:400px"></div>
</body>

</html>[/mw_shl_code]
测试截图如下

生成的图片

注意事项：
Highcharts_exporting.html 的文档格式，编码一定是
[mw_shl_code=html,true]<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">[/mw_shl_code]
否则将出错

四、资源下载
上述已经实现的 php 版导出服务器相关文件打包提供下载，下载解压到 web 服务即可使用
下载地址： http://pan.baidu.com/s/13QJRg