radarChart:原始代码

  1. new wxCharts({
  2. canvasId: 'radarCanvas',
  3. type: 'radar',
  4. categories: ['1', '2', '3', '4', '5', '6'],
  5. series: [{
  6. name: '成交量1',
  7. data: [90, 110, 125, 95, 87, 122]
  8. }],
  9. width: 320,
  10. height: 200,
  11. extra: {
  12. radar: {
  13. max: 150
  14. }
  15. }
  16. });

C#:服务器关键代码:

  1. public void ProcessRequest(HttpContext context)
  2. {
  3. context.Response.ContentType = "text/plain";
  4. StringBuilder sb = new StringBuilder();
  5.  
  6. sb.Append("{");
  7. sb.Append("\"XCXArray\":");
  8. sb.Append("[");
  9. sb.Append("{");
  10. sb.Append("\"canvasId\": \"radarCanvas\", ");
  11. sb.Append("\"type\": \"radar\", ");
  12. sb.Append(" \"categories\":[\"1\", \"2\", \"3\", \"4\", \"5\", \"6\"], ");
  13. sb.Append(" \"series\": [{ ");
  14. sb.Append("\"name\": \"成交量1\", ");
  15. sb.Append("\"data\": [90, 110, 125, 95, 87, 122] ");
  16. sb.Append("}], ");
  17. sb.Append("\"width\": 320, ");
  18. sb.Append("\"height\": 200 ");
  19.  
  20. sb.Append("}");
  21. sb.Append("]");
  22. sb.Append("}");
  23.  
  24. context.Response.Write(sb.ToString());
  25. }

JS:关键代码

  1. /**
  2. * 生命周期函数--监听页面加载
  3. */
  4. onLoad: function (options) {
  5.  
  6. var that = this;
  7. /*
  8. 这个地方非常重要,重置data{}里数据时候setData方法的this应为
  9. 以及函数的this, 如果在下方的sucess直接写this就变成了wx.request()
  10. 的this了 url: 'http://comsn.cn/Msm/HerNeo.ashx',
  11. */
  12. wx.request({
  13. url: 'http://localhost:51887/HandlerTest.ashx', //访问服务器 URL
  14. data: {
  15. 'TypeID': "0",
  16. 'ImageID': '',
  17. 'Name': ''
  18. },
  19. method: 'POST',
  20. header: {
  21. 'content-type': 'application/x-www-form-urlencoded'
  22. },
  23. success: function (res) {
  24. var dddf = res.data.XCXArray; // 获取 Charts 参数
  25. that.setData({
  26. XCXArray: res.data
  27. })
  28. console.log(dddf);
  29. console.log(dddf[0].series[0].name);
    ----------------------------------------------------------
    ------- 配置 Charts 参数 参数
  30. new wxCharts({
  31. canvasId: dddf[0].canvasId,
  32. type: dddf[0].type,
  33. categories: dddf[0].categories,
  34. series: [{
  35. name: dddf[0].series[0].name,
  36. data: dddf[0].series[0].data
  37. }],
  38. width: dddf[0].width,
  39. height: dddf[0].height,
  40. extra: {
  41. radar: {
  42. max: 150
  43. }
  44. }
  45. });
    ------------------------------------------------------
  46. },
  47. fail: function (res) {
  48. console.log('submit fail');
  49. },
  50. complete: function (res) {
  51. console.log('submit complete');
  52. }
  53. })
  54.  
  55. },

wx-charts 微信小程序图表 -- radarChart C# .net .ashx 测试的更多相关文章

  1. 微信小程序图表插件 - wx-charts

    微信小程序图表插件(wx-charts)基于canvas绘制,体积小巧支持图表类型饼图.线图.柱状图 .区域图等图表图形绘制,目前wx-charts是微信小程序图表插件中比较强大好使的一个. wx-c ...

  2. 微信小程序~下拉刷新真机测试不弹回的处理办法

    问题描述: 下拉刷新在手机上不会自动回弹,开发工具可以 解决办法: 主动调用wx.stopPullDownRefresh /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDow ...

  3. 微信小程序开发 [05] wx.request发送请求和妹纸图

    1.wx.request 微信小程序中用于发起网络请求的API就是wx.request了,具体的参数太多,此处就不再一一详举了,基本使用示例如下: wx.request({ url: 'test.ph ...

  4. [转]微信小程序联盟 跳坑《一百八十一》设置API:wx.openSetting使用说明

    本文转自:http://www.wxapp-union.com/forum.php?mod=viewthread&tid=4066 这个API解决了过去一个长久以来无法解决的问题,如何让用户重 ...

  5. 微信小程序开源项目库汇总

    最近做了一个微信小程序开源项目库汇总,里面集合了OpenDigg 上的优质的微信小程序开源项目库,方便移动开发人员便捷的找到自己需要的项目工具等,感兴趣的可以到GitHub上给个star. UI组件 ...

  6. 微信小程序开源项目库集合

    UI组件 weui-wxss ★852 - 同微信原生视觉体验一致的基础样式库 Wa-UI ★122 - 针对微信小程序整合的一套UI库 wx-charts ★105 - 微信小程序图表工具 wema ...

  7. 微信小程序一:微信小程序UI组件、开发框架、实用库

    作者:NiceCui 本文谢绝转载,如需转载需征得作者本人同意,谢谢. 本文链接:http://www.cnblogs.com/NiceCui/p/8079095.html 内容持续更新,维护中 邮箱 ...

  8. 微信小程序基础之开源项目库汇总

    awesome-github-wechat-weapp 是由OpenDigg整理并维护的微信小程序开源项目库集合.我们会定期同步OpenDigg上的项目到这里,也欢迎各位提交项目给我们. (链接:ht ...

  9. 微信小程序UI组件、开发框架、实用库...

    UI组件 weui-wxss ★852 - 同微信原生视觉体验一致的基础样式库 Wa-UI ★122 - 针对微信小程序整合的一套UI库 wx-charts ★105 - 微信小程序图表工具 wema ...

随机推荐

  1. redis info 详解

    # Server(服务器信息)redis_version:3.0.6                              #redis服务器版本redis_git_sha1:00000000   ...

  2. 【spring】task 任务调度(定时任务)

    1.定时任务的几种实现可以看这里:http://gong1208.iteye.com/blog/1773177 2.需要导入spring的jar包,可以参看之前的[spring]相关文章 3.这里使用 ...

  3. System.net.mail.smtpException;服务器提交了协议冲突 服务器响应为:

    最近发邮件遇到问题. 主机godaddy 端口 25,80 都可以用 stmp服务器地址:smtpout.secureserver.net 不支持ssl 我就吧 EnableSsl 设置为false了 ...

  4. Asp.Net Core Web Api图片上传(一)集成MongoDB存储实例教程

    Asp.Net Core Web Api图片上传及MongoDB存储实例教程(一) 图片或者文件上传相信大家在开发中应该都会用到吧,有的时候还要对图片生成缩略图.那么如何在Asp.Net Core W ...

  5. python中使用xlrd、xlwt和xlutils3操作Excel

    简单试了下python下excel的操作,使用了xlrd.xlwt和xlutil3:xlrd可以实现excel的读取操作,xlwt则是写入excel操作,xlutils3主要是为了修改excel,简单 ...

  6. Python GUI之tkinter窗口视窗教程大集合(看这篇就够了)

    一.前言 由于本篇文章较长,所以下面给出内容目录方便跳转阅读,当然也可以用博客页面最右侧的文章目录导航栏进行跳转查阅. 一.前言 二.Tkinter 是什么 三.Tkinter 控件详细介绍 1. T ...

  7. Mybatis解析mapper

    众所周知,接口是不能被实例化的,但是日常开发中,我们经常能直接使用dao层对象的方法,这又是为什么呢. 带着这些问题,我们看下mybatis内部做了那些操作. Mapper解析 上文我们描述了myba ...

  8. Java 容器 & 泛型:五、HashMap 和 TreeMap的自白

    Writer:BYSocket(泥沙砖瓦浆木匠) 微博:BYSocket 豆瓣:BYSocket Java 容器的文章这次应该是最后一篇了:Java 容器 系列. 今天泥瓦匠聊下 Maps. 一.Ma ...

  9. Android UI(二)DridView的菜单

    Jeff Lee blog:   http://www.cnblogs.com/Alandre/  (泥沙砖瓦浆木匠),retain the url when reproduced ! Thanks ...

  10. Chapter 4 Invitations——3

    Edward was never surrounded by crowds of curious by standers eager for his firsthand account. Edward ...