搜索

首页  >  问答  >  正文

百度echarts php为什么加上window.onresize = myChart.resize;还是自适应失败?


<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <title>WAP</title>
</head>
<body>

    <p style="height:50px;text-align:center;"><span>WAP</span></p>
    <!-- 为ECharts准备一个具备大小(宽高)的Dom -->
    <p id="main" style="height:500px;"></p>
    <!-- ECharts单文件引入 -->
    <script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
    <script type="text/javascript">
        // 路径配置
        require.config({
            paths: {
                echarts: 'http://echarts.baidu.com/build/dist'
            }
        });

        // 使用
        require(
            [
                'echarts',
                'echarts/chart/line',
            ],
            function (ec) {
                // 基于准备好的dom,初始化echarts图表
                var myChart = ec.init(document.getElementById('main'));

                var option = {
    tooltip : {
        trigger: 'axis'
    },
    legend: {
        data:['baidu','google','sm','sogou','so','yesterday_str','count']
    },
    toolbox: {
        show : false,
        feature : {
            mark : {show: true},
            dataView : {show: true, readOnly: false},
            magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},
            restore : {show: true},
            saveAsImage : {show: true}
        }
    },
    calculable : true,
    grid:{
        y:120,
    },
    xAxis : [
        {
            type : 'category',
            boundaryGap : false,

            <?php
                $con = mysql_connect("127.0.0.1","root","");
                if (!$con)
                  {
                  die('Could not connect: ' . mysql_error());
                  }
                mysql_query("SET NAMES UTF8");
                mysql_select_db("rizhifenxi", $con);
                $result = mysql_query("select * from wapliuliang order by yesterday_str");

                echo 'data : [';
                while($row = mysql_fetch_array($result))
                  {
                  echo "'".$row['yesterday_str']."'";
                  echo ",";
                  }
                echo ']';
                mysql_close($con);
            ?>
        }
    ],
      yAxis : [
        {
            type : 'value',
            axisLabel : {
                formatter: '{value}'
            }
        }
    ],
    series : [
        <?php

        $con = mysql_connect("127.0.0.1","root","");
        if (!$con)
          {
          die('Could not connect: ' . mysql_error());
          }
        mysql_query("SET NAMES UTF8");
        mysql_select_db("rizhifenxi", $con);
        $result = mysql_query("select * from wapliuliang order by yesterday_str");


        for ($x=1;$x<=7;$x++) {

          $re_name = mysql_field_name($result,$x);
          echo " {name:'".$re_name."',type:'line',line: '总量',data:[ ";
          while($row = mysql_fetch_array($result))
            {
            echo $row[$x].',';
            }
          echo ']},';
          mysql_data_seek($result,0);

        }

        mysql_close($con);
    ?>
    ]
};
                // 为echarts对象加载数据
                myChart.setOption(option);
                // 加上这一句即可
                window.onresize = myChart.resize;
            }
            
        );
    </script>
</body>

为什么加上window.onresize = myChart.resize;这句还是自适应失败呢?
怎么样才能够实现自适应手机呢?

世界只因有你世界只因有你2754 天前665

全部回复(3)我来回复

  • 怪我咯

    怪我咯2017-05-16 13:10:14

    你改成

    window.onresize = function(){
           myChart.resize();
    };

    在echarts的resize方法中应该用到了this,按照你的赋值方式,发生窗口大小变化时,这个this将指代window,而没有去操作echart。

    回复
    0
  • ringa_lee

    ringa_lee2017-05-16 13:10:14

    楼上正解 window.onreszie = function(){ myChart.size()}

    回复
    0
  • 黄舟

    黄舟2017-05-16 13:10:14

    楼上正解 window.onreszie = function(){ myChart.size()}

    回复
    0
  • 取消回复