低代码平台

低代码开发平台

宜搭-云钉低代码应用构建平台-阿里巴巴旗下产品 (aliwork.com)：钉钉。

**jeecg-boot**：java低代码。

imgcook：由设计稿一键智能生成代码

视频中使用的是 sketch 插件，我是 windows 系统……，下载完 sketch 一查只能在 Mac 上使用。下载了 Photoshop 插件，安装了，我在 Photoshop 上找不到插件，我看了看 imgcook 文档可以直接上传图片然后生成相关代码。我平时不常用 Photoshop ，直接把 Photoshop 插件清除了。上传图片生成代码的链接我放在相关资料里了。

CodeFun：UI 设计稿智能生成源代码

以上是我对下列视频及文章的归纳和总结

CodeFun - UI 设计稿智能生成源代码

2020-08-04发表2021-07-30更新3 分钟读完 (大约483个字)

H5 —— SVG、Canvas、Webgl 从入门到实践开发

SVG

Canvas

常见的数据可视化库：

D3.js：Web端评价最高的 JavaScript 可视化工具库（入手难）
ECharts.js
Highcharts.js
AntV

ECharts

配置参数

(function(){
  // 1、实例化对象
  var myChart = echarts.init(document.querySelector('.bar .chart'));
  // 2、指定配置项和数据
  var option = {
      
  }
  // 3、把配置项给实例对象
  myChart.setOption(option)
  // 适配屏幕自适应  
  window.addEventListener('resize',function (){
    myChart.resize()
  });
})();

/* 约束屏幕尺寸 */
@media screen and (max-width: 1024px) {
  html {
    font-size: 42px !important;
  }
}

@media screen and (min-width: 1920) {
  html {
    font-size: 80px !important;
  }
}

折线图数据加单位

//  显示单个数据
tooltip: {
  show:true,
  trigger:'item',
  formatter: function(params){
    var relVal = params.seriesName +'<br/>' + params.value + '%';  
    return relVal
  }
},

// 显示多个数据
tooltip: {
  trigger: 'axis',
  formatter:function(params) {  
    var relVal = params[0].name;  
    for (var i = 0, l = params.length; i < l; i++) {  
        relVal += '<br/>' + params[i].marker + params[i].seriesName + ' : ' + params[i].value+"件";
    }
    return relVal;  
  }
},

tooltip: {
  trigger: 'axis',
  formatter: '{a}{b}{c}'
},