您需要登录后才可以操作登录 | 立即注册
关闭
楼主
ejbone
  • TA的每日心情
    开心
    2018-10-8 18:08
  • 签到天数: 1 天

    连续签到: 1 天

    [LV.1]初来乍到

    [UI框架] echarts在htc上有弹框没有柱子和柱子颜色,xy轴也没有 [复制链接]

    51 2 发表于 2018-10-31 14:59:39

    1. <!DOCTYPE html>
    2. <html class="um landscape min-width-240px min-width-320px min-width-480px min-width-768px min-width-1024px">
    3.     <head>
    4.         <title></title>
    5.         <meta charset="utf-8">
    6.         <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
    7.         <link rel="stylesheet" href="../css/fonts/font-awesome.min.css">
    8.         <link rel="stylesheet" href="../css/ui-box.css">
    9.         <link rel="stylesheet" href="../css/ui-base.css">
    10.         <link rel="stylesheet" href="../css/ui-color.css">
    11.         <link rel="stylesheet" href="../css/appcan.icon.css">
    12.         <link rel="stylesheet" href="../css/appcan.control.css">
    13.         <link rel="stylesheet" href="../mycss/common.css">
    14.         <link rel="stylesheet" href="../mycss/shouye.css">
    15.         <title>首页</title>
    16.     </head>
    17.     <body class="um-vp" ontouchstart style="font-family: '微软雅黑';background-color:#f3f3f3">
    18.         <div class="cr_Page up ub ub-ver" tabindex="0" data-control="PAGE" id="Page" style="background-color:#f3f3f3,font-family: '微软雅黑'" >
    19.             <!-- 头部开始 -->
    20.            
    21.             <!-- 头部结束 -->            
    22.             <!-- 内容 -->
    23.          <div id="mine_contBox" class="mine_contBox">
    24.          
    25.             <!-- echarts-->
    26.             <div style="height: 18em;margin-left: .3em;" id="main"></div>
    27.         </div>     
    28.         <script src="../js/appcan.js"></script>
    29.         <script src="../js/appcan.control.js"></script>
    30.         <script src="../js/appcan.scrollbox.js"></script>
    31.         <script src="../js/echarts/echarts.min.js"></script>
    32.          <script>
    33.         var myChart = echarts.init(document.getElementById('main'));
    34. appcan.ready(function() {
    35.    
    36. echartst();
    37. });
    38. function echartst() {

    39.     // 指定图表的配置项和数据
    40.     var option = {
    41.     title : {
    42.         text: '某地区蒸发量和降水量',
    43.         subtext: '纯属虚构'
    44.     },
    45.     tooltip : {
    46.         trigger: 'axis'
    47.     },
    48.     legend: {
    49.         data:['蒸发量','降水量']
    50.     },
    51.     toolbox: {
    52.         show : true,
    53.         feature : {
    54.             dataView : {show: true, readOnly: false},
    55.             magicType : {show: true, type: ['line', 'bar']},
    56.             restore : {show: true},
    57.             saveAsImage : {show: true}
    58.         }
    59.     },
    60.     calculable : true,
    61.     xAxis : [
    62.         {
    63.             type : 'category',
    64.             data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月']
    65.         }
    66.     ],
    67.     yAxis : [
    68.         {
    69.             type : 'value'
    70.         }
    71.     ],
    72.     series : [
    73.         {
    74.             name:'蒸发量',
    75.             type:'bar',
    76.             data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3],
    77.             markPoint : {
    78.                 data : [
    79.                     {type : 'max', name: '最大值'},
    80.                     {type : 'min', name: '最小值'}
    81.                 ]
    82.             },
    83.             markLine : {
    84.                 data : [
    85.                     {type : 'average', name: '平均值'}
    86.                 ]
    87.             }
    88.         },
    89.         {
    90.             name:'降水量',
    91.             type:'bar',
    92.             data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
    93.             markPoint : {
    94.                 data : [
    95.                     {name : '年最高', value : 182.2, xAxis: 7, yAxis: 183},
    96.                     {name : '年最低', value : 2.3, xAxis: 11, yAxis: 3}
    97.                 ]
    98.             },
    99.             markLine : {
    100.                 data : [
    101.                     {type : 'average', name : '平均值'}
    102.                 ]
    103.             }
    104.         }
    105.     ]
    106. };


    107.     // 使用刚指定的配置项和数据显示图表。
    108.     myChart.setOption(option);
    109. }
    110.         </script>
    111.     </body>
    112. </html>


    复制代码


    沙发
    AppCan运营
  • TA的每日心情
    开心
    2018-6-6 14:54
  • 签到天数: 128 天

    连续签到: 1 天

    [LV.7]常住居民III

    显示全部楼层 发表于 2018-11-1 11:15:20
    这个自己调试下吧,或者换成我们封装的插件uexchart试试。
    板凳
    ejbone
  • TA的每日心情
    开心
    2018-10-8 18:08
  • 签到天数: 1 天

    连续签到: 1 天

    [LV.1]初来乍到

    显示全部楼层 发表于 2018-11-7 18:04:33
    AppCan运营 发表于 2018-11-1 11:15
    这个自己调试下吧,或者换成我们封装的插件uexchart试试。

    htc echarts 高度大于10em就不显示
    主题:
    级别:游客
    发帖:
    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    快速回复 返回顶部 返回列表