本文转自：

http://jsfiddle.net/vCZ8V/1/

http://www.stepday.com/topic/?740

http://blog.csdn.net/yueritian/article/details/30777351

<html>

<head>

   <title>Highcharts 教程 | 菜鸟教程(runoob.com)</title>

   <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>

<script src="http://code.highcharts.com/highcharts.js"></script>

   <script src="http://code.highcharts.com/highcharts-more.js"></script>  

</head>

<body>

<div id="container" style="height: 50%">

<script language="JavaScript">

       $(window).resize(function()

{

    chart.setSize(

       $(document).width(),

       $(document).height()/2,

       false

    );

});

$(document).ready(function() {  

var chart = new Highcharts.Chart({

    chart: {

        renderTo: container,

        spacingTop: 3,

        spacingRight: 0,

        spacingBottom: 3,

        spacingLeft: 0

    },

    credits: {

        enabled: false

    },

    xAxis: {

        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']

    },

    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]

    }]

});

});

</script>

</body>

</html>

[转]highcharts图表入门之：如何让highcharts图表自适应浏览器窗体的大小或者页面大小的更多相关文章

  1. highCharts图表入门简介

    一.Highcharts简介 Highcharts:功能强大.开源.美观.图表丰富.兼容绝大多数浏览器的纯js图表库 Highcharts是一款纯javascript编写的图表库,能够很简单便捷的在W ...

  2. [笔记]学习HighCharts的使用（不错的web图表插件）

    最近有一个小项目需要用到折线图.到处请教了一下,有人给我推荐了highcharts.感觉还不错,就稍微学习下.这里记录一下学习的过程. 网上相关的内容还不少,我就说一下我学习的内容. 看的第一篇文章& ...

  3. Highcharts 时间序列，可缩放的图表；Highcharts X 轴翻转曲线图；Highcharts 带标记曲线图

    Highcharts 时间序列,可缩放的图表 配置 图表 配置可缩放图表. chart.zoomType 指定了用户可以拖放的尺寸,用户可以通过拖动鼠标来放大,可能值是x,y或xy: var char ...

  4. Highcharts报表——让你的网页上图表画的飞起

    Highcharts是一款纯javascript编写的图表库,能够很简单便捷的在Web网站或Web应用中添加交互性的图表,Highcharts目前支持直线图.曲线图.面积图.柱状图.饼图.散点图等多达 ...

  5. Highcharts Highstock 学习笔记 第一篇 Highcharts配置

    Highcharts是一款纯javascript编写的图表库,能够很简单便捷的在Web网站或Web应用中添加交互性的图表,Highcharts目前支持直线图.曲线图.面积图.柱状图.饼图.散点图等多达 ...

  6. R图表入门

    R图表入门 R语言最强的功能就是统计和作图了,在学习了基本语法之后,博主马上体验了一下R的图表功能 条形图 例1 H = c(7,12,28,3,41) M = c("Mar",& ...

  7. Echart图表入门

    1.Echart是什么? Enterprise Charts的缩写,商业级数据图表,一个纯Javascript的图表库.更多的内容可以参考网上的资料 2.使用步骤 a.下载开发包 官网地址:http: ...

  8. echarts图表自适应浏览器窗口的大小

    echarts问题描述 当浏览器窗口发生变化时,echarts图表未能自适应浏览器的变化,产生如下的效果 解决方案 在$(function(){}中添加 window.onresize = funct ...

  9. Echarts同一页面多个图表自适应浏览器窗口大小——window.onresize

    当前做的一个项目中,频繁使用到百度团队的Echarts,发在一个页面同时出现多个图表时,只有最后一个图表触发了window.onresize事件,查询官方文档后得到解决. 方法如下: hwChart. ...

随机推荐

  1. 【洛谷 p3382】模板-三分法（算法效率）

    题目:给出一个N次函数,保证在范围[l,r]内存在一点x,使得[l,x]上单调增,[x,r]上单调减.试求出x的值. 解法:与二分法枚举中点使区间分成2份不一样,三分法是枚举三分点,再根据题目的情况修 ...

  2. php学习笔记：利用递归实现删除文件目录

    直接删除目录,如果是空目录是可以删除,如果不是空目录,这时候只能先删除目录里面的文件,然后再删除目录.我封装了个删除函数,然后直接调用这个函数.喜欢的可以直接拿去用,编码是gbk的,使用时候注意下编码 ...

  3. SQL Server 全局变量

    SQL Server中所有全局变量都使用两个@符号作为前缀 --1.@@error 最后一个T-SQL错误的错误号(目的是或得违反约束的错误号) insert into Subject values( ...

  4. 小白初学ABP框架，着实累啊

    这几天在学习ABP相关的知识AutoMapper ,AngularJS,Less,DI(dependencyInjection),EntityFramework code first以及相关NuGet ...

  5. HttpController的激活

    Web API调用请求的目标是定义在某个HttpController类型中的某个Action方法,所以消息处理管道的最终需要激活目标HttpController对象.调用请求的URI会携带目标Http ...

  6. 优秀程序设计的Kiss原则(keep it simple,stupid)

    优秀程序设计的Kiss原则(keep it simple,stupid) 良好的编程原则与良好的设计工程原则密切相关.本文总结的这些设计原则,帮助开发者更有效率的编写代码,并帮助成为一名优秀的程序员. ...

  7. jvisualvm远程监控jvm设置

    有些时候,需要对特定环境中的Java应用进行实时性能分析,大部分非开发和测试环境,一般都是用jvisualvm进行基本检测以最小化对系统的影响(其开启后,负载影响大约20%-30%),jvisualv ...

  8. linux实现rdp访问

    远程访问linux系统,我们常用的有终端ssh.图形界面VNC,但是VNC安全性不够,并且不够流畅.相比之下,我认为rdp更好,并且还能利用windows的远程桌面访问,非常方便. 1. 安装xRDP ...

  9. [HTML5] 飞龙天惊-HTML5学习系列

    飞龙天惊 cnblog URL:http://www.cnblogs.com/fly_dragon/ Html5 学习系列(一)认识HTML5 http://www.cnblogs.com/fly_d ...

  10. 【干货分享】Node.js 中文资料导航

    这篇文章与大家分享一批高质量的的 Node.js 中文资料.Node.js 是一个基于 Chrome JavaScript 运行时建立的一个平台, 用来方便地搭建快速的, 易于扩展的网络应用 Node ...