微信小程序精品插件：饼状图，K线图

cyk · 发表于 2017-1-11 17:13:10

本帖最后由 cyk 于 2017-1-11 18:09 编辑

很多人一直在找的K线图

代码实例：
[mw_shl_code=applescript,true]//引入painter工厂
var painterFactoryFile = require("painter/painterFactory.js");
var painterFactory = painterFactoryFile.painterFactory;
/**
* @author Merlin
* @date 2016-11-10
* @description 图表库
*/
var chartUtil = {
createObj : function(){
      var obj = {};
      //需要渲染图表的 canvas ID
      var _canvas_id = null;
      //参数配置
      var _options = null;
      //setter and getter
      obj.setCanvasId = function(canvas_id){
         _canvas_id = canvas_id;
      }
      obj.getCanvasId = function(){
         return _canvas_id;
      }
      obj.setOptions = function(options){
         _options = options;
      }
      obj.getOptions = function(){
         return _options;
      }
      /**
      * 初始化
      */
      obj.init = function(canvas_id, options){
         obj.setCanvasId(canvas_id);
         obj.setOptions(options);
      }
      obj.hello = function(){
         console.log("hello world");
      };
      obj.draw = function(){
         var testPainterObj = painterFactory.createObj(_canvas_id, _options);
         testPainterObj.draw();
      };
      return obj;
}
};

module.exports.chartUtil = chartUtil;
//引入其他文件
var chartTypeFile = require("chartType.js");
var chartType = chartTypeFile.chartType;
module.exports.chartType = chartType;
var chartColorFile = require("chartColor.js");
var chartColor = chartColorFile.chartColor;
module.exports.chartColor = chartColor;[/mw_shl_code]

[mw_shl_code=applescript,true]Page({
  canvasIdErrorCallback: function (e) {
console.error(e.detail.errMsg)
  },
  onReady: function (e) {
//引入文件
var chartUtilFile = require("../../utils/wxChart/chartUtil.js");
//实例化
var chartUtilObj = chartUtilFile.chartUtil.createObj();
//配置参数
var canvas_id = "first_canvas";
var xaxis = [
   {
      xdata : ["07:00", "11:00", "15:00", "20:00", "00:00", "04:00"]
   }
];
var ydata = [Math.round(Math.random()*200)];
for (var i = 1; i < 200; i++) {
      ydata.push(Math.round((Math.random() - 0.5)*10 + ydata[i-1]));
}
var yaxis = [
   {
      ydata : ydata
   }
];
var options = {
   "page_obj" : this,
   "chart_type" : chartUtilFile.chartType.brokenLine,
   "xaxis" : xaxis,
   "yaxis" : yaxis,
   "line_color" : chartUtilFile.chartColor.red,
   "text" : "此处放标题！",
   "unit" : "（元/10克）",
   "font_size": 10
};
//初始化
chartUtilObj.init(canvas_id, options);
//开始画图
chartUtilObj.draw();
  },
  data: {
imgUrls: [
   'http://cdn.qilin99.cn/ctrade_cms/img/default_1479207074514',
   'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg',
   'http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg',
   'http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg'
],
indicatorDots: false,
autoplay: true,
interval: 5000,
duration: 1000
  }
})[/mw_shl_code]

游客，如果您要查看本帖隐藏内容请回复

大大大i · 发表于 2019-4-10 14:35:08

正需要谢谢大佬

永恒代价 · 发表于 2019-5-25 23:28:19

正需要谢谢大佬

jack56846 · 发表于 2020-4-4 16:37:42

我有流量，你有产品，我们就可以合作，有意的个人开发者朋友可以联系微,信,号j i m 2 0 1 8 0 6 8 8，详聊

		自动登录	找回密码
密码			立即注册

微信小程序精品插件：饼状图，K线图

本帖子中包含更多资源

优秀版主