本文转自：

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. AxWebBrowser与WebBrowserU盾登陆时的使用

    PS:上个月为财务小妹做了个自动上传报表的工具,财务妹子表示调戏我很开心T_T~~.   由于该小程序涉及到登陆,准备用WebBroswer,这一下撞墙上了,无法展示U盾密码框.   我在博问上的问题 ...

  2. VS用法总结

    工欲善其事,必先利其器,关于VS的“即时窗口”的使用: 打开“即时窗口”的快捷键是:Ctrl + Alt + I. 要在“即时窗口”中打印查看打印输出结果,必须按如下步骤设置:[工具]→[选项]→[调 ...

  3. springMVC全局Exception异常处理SimpleMappingExceptionResolver

    继承了SimpleMappingExceptionResolver 贴上代码 /** * 对controller异常进行全局处理 * 区分了对普通请求和ajax请求的异常处理,普通请求返回到配置的er ...

  4. C语言回滚(二)--循环打印

    //1.用循环打印 /* FFEFEDFEDCFEDCBFEDCBA */ #include <stdio.h> #include<stdlib.h> int main(){ ...

  5. PHP学习笔记：MySQL数据库的操纵

    Update语句 Update 表名 set 字段1=值1, 字段2=值2  where  条件 练习: 把用户名带  ‘小’的人的密码设置为123456@ 语句:UPDATE crm_user SE ...

  6. javascript的封装实例

    StringBuffer方法的js自定义封装: <!doctype html><html lang="en"> <head> <meta ...

  7. cl_gui_cfw=>dispatch

    将已经触发的EVENT发送给他们各自的EVENT HANDLER,以便让这些事件得到响应. 根据返回值可以判断是否发送成功. CALL METHOD cl_gui_cfw=>dispatch   ...

  8. 操作集合的工具类：Collections

    Java提供了一个操作Set.List和Map等集合的工具类:Collections,该工具类提供了大量方法对集合进行排序.查询和修改等操作,还提供了将集合对象置为不可变.对集合对象实现同步控制等方法 ...

  9. Android-Selector用法

    在项目开发的时候,由于系统给出的控件不够美观,因此开发时领导常常要我更改下界面,用美工给的图片取代系统图片.开始时,我只是给按钮等设置一下背景图片,这样做虽然美观了,但界面看起来却比较死板,比如用户点 ...

  10. iOS设计模式之迭代器模式

    迭代器模式 基本理解 迭代器模式(Iterrator):提供一个方法顺序访问一个聚合对象中的各个元素,而又不暴露该元素的内部表示. 当你访问一个聚合对象,而且不管这些对象是什么都需要遍历的时候,你就应 ...