echarts + php 页面多统计图屏幕自适应

转载 2017年08月12日 16:39:33
var myStyle= echarts.init(document.getElementById("xiaosell"));
myStyle.setOption({
    title:{},
    tooltip:{
        trigger: 'axis'
    },
    legend:{
        //data:['营收']
    },
    grid: {
        top:'11%',
        left: '1%',
        right: '2%',
        bottom: '2%',
        containLabel: true
    },
    toolbox: {
//        下载图片
//        feature: {
//            saveAsImage: {}
//        }
    },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: ['1月份','2月份','3月份','4月份','5月份','6月份','7月份','8月份','9月份','10月份','11月份','12月份']
    },
    yAxis: {
        type: 'value',
        axisLabel:{
            formatter:'{value} k'
        },
        boundaryGap: false  //边界的间隙
    },
    series: [
        {
            name:'营收',
            type:'line',
            legendHoverLink : false,//禁止高亮
            itemStyle:{
                normal:{
                    color:'#0F88EB',
                    textStyle : {
                        label : {
                            color:'#0F88EB'
                        }
                    },
                    lineStyle:{
                        color:'#0F88EB',
                        width:1
                    }
                }
            },
            data:['12', '13', '17', '14', '19', '20', '21','12','24','23','24','23']
        }]
});
使用window.onresize = option.chart.resize()  不行,单个可以,下面的可以
 window.addEventListener("resize", function () {     //添加一个监听
                      option.chart.resize();
                  });


window.addEventListener("resize", function () {

    setTimeout("myStyle.resize()",100);

});

如何设计自适应屏幕大小的网页

随着3G的普及,越来越多的人使用手机上网。 移动设备正超过桌面设备,成为访问互联网的最常见终端。于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页? 手机...
  • ding_dq
  • ding_dq
  • 2017年02月17日 12:48
  • 6597

echarts选项卡切换效果,并且自适应随着窗口大小变大变小。

首先先来个效果图: 这个是缩小后的窗口: 切换效果: 下面是代码:我用的是echarts3.0的,首先要去官网把echarts.min.js下载下来 我写的是bootstrap...
  • kakaxiD
  • kakaxiD
  • 2016年06月20日 11:59
  • 11907

插件echarts使数据可视化后,图随窗口自适应变化的方法

echarts使用过程中,图随窗口变化的自适应。
  • lvkelly
  • lvkelly
  • 2016年12月19日 18:44
  • 6585

Echarts统计图插件在php中的应用

统计样图 数据库链接
  • Homsune
  • Homsune
  • 2017年01月01日 22:46
  • 266

百度ECharts 3.0 多坐标轴统计图一般配置详解(实例)

ECharts 是百度出品的jquery图表插件。相对于Chartist,拥有更加强大的功能,以及更加详细的文档(ECharts的文档形式非常优秀,简明易懂)。ECharts支持的图表种类非常多,同时...
  • JathamJ
  • JathamJ
  • 2016年10月03日 19:58
  • 4763

arcgis api for js之echarts开源js库实现地图统计图分析

前面写过一篇关于arcgis api for js实现地图统计图的,具体见:http://www.cnblogs.com/giserhome/p/6727593.html 那是基于dojo组件来实现图...
  • liguoweioo
  • liguoweioo
  • 2017年12月22日 21:23
  • 293

echarts 地图 热点 统计图

echarts 地图
  • ITrookieGe
  • ITrookieGe
  • 2016年04月22日 16:13
  • 2644

echarts的应用(利用后台传回json创建统计图,以及和ext的关联使用等)

最近要做统计图表所以用了echarts ,效果不错,而且也很简单。根据echarts需要的数据类型后台拼接json,再用js拆分组装成对应数组数据等。就实现了功能。 效果图 1.最简单的: 2.带...
  • qq_35943977
  • qq_35943977
  • 2017年04月24日 15:11
  • 1032

echarts 生成统计图时,自动保存图片到服务器,并使用freemarker生成word

echarts 生成统计图时,自动保存图片到服务器,并使用freemarker生成word。 1.项目工程截图如下: 需要echarts包和生成word的freemarker-...
  • SHEN525758203
  • SHEN525758203
  • 2015年09月22日 15:41
  • 3781

echarts 生成统计图时,自动保存图片到服务器,并使用freemarker生成word

echarts 生成统计图时,自动保存图片到服务器,并使用freemarker生成word。 1.项目工程截图如下: 需要echarts包和生成word的freemarker-...
  • Leolu007
  • Leolu007
  • 2015年12月01日 09:26
  • 10365
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:echarts + php 页面多统计图屏幕自适应
举报原因:
原因补充:

(最多只允许输入30个字)