FAQ > .Web应用 > .web应用案例

Q：如何在.web页面中使用参数控制图形局部刷新    

  • A：一个web页面中可以配置多个区域的图表或文本内容，一般存在静态与动态的区域。
     动态的区域可以设置为按时自动刷新及通过传入可选参数控制显示的结果。
     本文介绍如何设置可选参数控制局部动态区域的显示结果。

    .web使用相关说明参考：FAQ：Q：Dotweb(.web)作图使用文档
    实现步骤
    步骤一.准备数据源函数并添加自定义组件
    数据源函数格式
    array(
      "options":(
       ("txt":"第一组","value":1),
       ("txt":"第二组","value":2,"selected":1),//selected:默认选中
       ("txt":"第三组","value":3)
      ),
      "paramname":"paramname",//paramname：必填，当前参数别名
      "linkname":"linkname1"//linkname：必填，区分每个内置参数的标识，联动时会联动和linkname相同的区域，联动不同区域时每个插件需要填写不同的linkname
     );

    添加自定义组件

    步骤二.配置自定义组件

    .tsf函数名填写：linkedSelect
    步骤三.与局部页面配置联动
    打开需要联动的容器编辑界面，填写样式类名，样式类名需要和linkname相同，刷新页面后即可联动
    容器编辑界面需为参数联动区域的外层界面。


    实现示例
    步骤一.准备自定义参数组件模型
    模型1：指数代码参数模型
    Function linkedSelectParam1();
    Begin
      data:=array(
        "options":(
        ("txt":"上证50","value":"SH000016"),
        ("txt":"上证180","value":"SH000010"),
        ("txt":"沪深300","value":"SH000300","selected":1),
        ("txt":"中证500","value":"SH000905"),
        ("txt":"中证1000","value":"SH000852")
        ),
        "paramname":"指数代码",
        "linkname":"linkParam"
        );
      return data;
    End;

    模型2：股票代码参数模型
    Function linkedSelectParam2();
    Begin
      stocks:=select StockName(thisrow) as "txt",thisrow as "value" from GetBK("上证50") end;
      stocks[0,"selected"]:=1;

      data:=array(
        "options":stocks,
        "paramname":"股票代码",
        "linkname":"linkParam"
        );
      return data;
    End;

    步骤二.准备web展示模型
    模型3：涨幅展示模型
    Function linkedSelectShowdata1(indexid,stockid);
    Begin
      SetSysParam(pn_stock(),indexid);
      SetSysParam(PN_Date(),today());
      setsysparam(pn_cycle(),cy_day());
      return Nday(30,'date',datetostr(sp_time()),
              indexid,stockzf3(),
              stockid,spec(stockzf3(),stockid)
          );
    End;

    模型4：振幅展示模型
    Function linkedSelectShowdata2(indexid,stockid);
    Begin
      SetSysParam(pn_stock(),indexid);
      SetSysParam(PN_Date(),today());
      setsysparam(pn_cycle(),cy_day);
      return Nday(30,'date',datetostr(sp_time()),
              indexid,stockzdf3(),
              stockid,spec(stockzdf3(),stockid)
          );
    End;

    步骤三.配置自定义参数组件
    分别配置两个自定义参数组件



    步骤四.配置网页局部区域展示页面
    区域内分别配置两个涨幅和振幅两个展示图形
    获取默认数后参数属性设置为隐藏

    步骤五.参数组件与网页局部区域联动配置
    编辑界面需在展示区域的外层

    步骤六.保存后查看展示效果
    调整参数的值，网页中联动区域的展示内容会随获取参数更新