利用highcharts在html页面混编jq引入失败问题

//用<script></script>加载jq失败
//当禁用<!--script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script-->,解决方法如下
//以及smarty展示数据用到数据库键值为变量情况
<!--script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script-->
<div id="container" style="min-width:400px;height:400px"></div>
{%script%}
    $(document).ready(function() {
        var title = {
            text: '接口性能'
        };
        var xAxis = {
            categories: []
        };
        var yAxis = {
            title: {
                text: '比例'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        };

        var legend = {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 0
        };

        var series =  [
            {
            {%if $data.key=='total_num'%}name: '请求个数',
            {%elseif $data.key=='upstream_time_50_rate'%}name: '后端请求时间大于50ms的比例',
            {%elseif $data.key=='upstream_time_100_rate'%}name: '后端请求时间大于100ms的比例',
            {%elseif $data.key=='upstream_time_200_rate'%}name: '后端请求时间大于200ms的比例',
            {%elseif $data.key=='upstream_time_500_rate'%}name: '后端请求时间大于500ms的比例',
            {%elseif $data.key=='upstream_time_1000_rate'%}name: '后端请求时间大于1000ms的比例',
            {%elseif $data.key=='request_time_50_rate'%}name: '服务请求时间大于50ms的比例',
            {%elseif $data.key=='request_time_100_rate'%}name: '服务请求时间大于100ms的比例',
            {%elseif $data.key=='request_time_200_rate'%}name: '服务请求时间大于200ms的比例',
            {%elseif $data.key=='request_time_500_rate'%}name: '服务请求时间大于500ms的比例',
            {%elseif $data.key=='request_time_1000_rate'%}name: '服务请求时间大于1000ms的比例',
            {%elseif $data.key=='redirect_rate'%}name: '请求跳转的比例',
            {%elseif $data.key=='fail_rate'%}name: '请求失败的比例',
            {%elseif $data.key=='succ_rate'%}name: '请求成功的比例',
            {%elseif $data.key=='create_time'%}name: '创建时间',
            {%else%}name: '等待选择范围',{%/if%}
                data: []
            }
        ];
        {%foreach $data.view as $k => $v%}
        xAxis.categories[{%$k%}] = '{%$v.create_time|date_format:'%m-%d'%}';
            {%if $data.key=='total_num'%}series[0].data[{%$k%}] = {%$v.total_num%};
            {%elseif $data.key=='upstream_time_50_rate'%}series[0].data[{%$k%}] = {%$v.upstream_time_50_rate%};
            {%elseif $data.key=='upstream_time_100_rate'%}series[0].data[{%$k%}] = {%$v.upstream_time_100_rate%};
            {%elseif $data.key=='upstream_time_200_rate'%}series[0].data[{%$k%}] = {%$v.upstream_time_200_rate%};
            {%elseif $data.key=='upstream_time_500_rate'%}series[0].data[{%$k%}] = {%$v.upstream_time_500_rate%};
            {%elseif $data.key=='upstream_time_1000_rate'%}series[0].data[{%$k%}] = {%$v.upstream_time_1000_rate%};
            {%elseif $data.key=='request_time_50_rate'%}series[0].data[{%$k%}] = {%$v.request_time_50_rate%};
            {%elseif $data.key=='request_time_100_rate'%}series[0].data[{%$k%}] = {%$v.request_time_50_rate%};
            {%elseif $data.key=='request_time_200_rate'%}series[0].data[{%$k%}] = {%$v.request_time_50_rate%};
            {%elseif $data.key=='request_time_500_rate'%}series[0].data[{%$k%}] = {%$v.request_time_50_rate%};
            {%elseif $data.key=='request_time_1000_rate'%}series[0].data[{%$k%}] = {%$v.request_time_50_rate%};
            {%elseif $data.key=='redirect_rate'%}series[0].data[{%$k%}] = {%$v.redirect_rate%};
            {%elseif $data.key=='fail_rate'%}series[0].data[{%$k%}] = {%$v.fail_rate%};
            {%elseif $data.key=='succ_rate'%}series[0].data[{%$k%}] = {%$v.succ_rate%};
            {%elseif $data.key=='create_time'%}series[0].data[{%$k%}] = {%$v.create_time%};
            {%else%}series[0].data[{%$k%}] = 0;{%/if%}
    {%/foreach%}
        var json = {};

        json.title = title;
        json.xAxis = xAxis;
        json.yAxis = yAxis;
        json.legend = legend;
        json.series = series;

        $('#container').highcharts(json);
    });
{%/script%}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值