Thingworx自带的图表数量有限，样式也很有限，在echarts上看到了这样一个非常简单的图表，下面将做一个简单的静态引入示范

首先创建Thingworx项目

然后右键ui新建widget

自动生成了四个文件，找到pie.ide.js，然后修改this.renderHtml = function()后的内容

通过以下代码引入echarts

$("body").append('<script type="text/javascript" src="../Common/extensions/[项目名]/ui/[widget名]/echarts4/echarts.min.js"></script>');

echarts目录必须在widget目录下面。

function的末尾返回echarts需要div

return '<div id="demo" style="width: 600px;height:400px;"></div>';

在this.afterRender = function ()方法后将echarts的示例代码添加进去

编译打包成zip，然后通过Thingworx的import功能导入，就能在mashup builder里看到了左侧自定义的gauge了，可以通过修改default_widget_icon.ide.png或者icon_url来更换图标。

这个例子是静态的，没有绑定Thing的Service获取动态的数据。Runtime需要照例再写一遍。

Thingworx SDK开发自定义Widget的更多相关文章

  1. 微信公众账号 Senparc.Weixin.MP SDK 开发教程 索引

    Senparc.Weixin.MP SDK从一开始就坚持开源的状态,这个过程中得到了许多朋友的认可和支持. 目前SDK已经达到比较稳定的版本,这个过程中我觉得有必要整理一些思路和经验,和大家一起分享. ...

  2. 【转】微信公众账号 Senparc.Weixin.MP SDK 开发教程 索引

    微信公众账号 Senparc.Weixin.MP SDK 开发教程 索引 Senparc.Weixin.MP SDK从一开始就坚持开源的状态,这个过程中得到了许多朋友的认可和支持. 目前SDK已经达到 ...

  3. 微信公众账号 Senparc.Weixin.MP SDK 开发教程

    http://www.cnblogs.com/szw/archive/2013/05/14/weixin-course-index.html 微信公众账号 Senparc.Weixin.MP SDK ...

  4. Android SDK 开发——发布使用踩坑之路

    前言 在 Android 开发过程中,有些功能是通用的,或者是多个业务方都需要使用的. 为了统一功能逻辑及避免重复开发,因此将该功能开发成一个 SDK 是相当有必要的. 背景 刚好最近自己遇到了类似需 ...

  5. iOS SDK开发汇总

    以前也做过静态库的开发,不过都是一些简单的调用,最近在做项目的时候,发现其中还有很多问题,所以建个小项目简单记录遇到的问题以及正确的解决办法. 在项目中遇到的问题如下:xib文件获取不到, story ...

  6. Android SDK开发与使用的那些事儿

    前言 最近由于工作需要,将应用里的部分功能独立了出来,封装成 SDK 提供给合作伙伴使用.由于经验不足,网上也没多少写这方面内容的文章,遇到了不少的坑,决定记录下来. SDK 其实,刚说到要写SDK也 ...

  7. 【转】OpenWRT开发自定义应用方法

    [转]OpenWRT开发自定义应用方法 转自:http://blog.csdn.net/rudyn/article/details/38616783 OpenWRT编译成功完成后,所有的产品都会放在编 ...

  8. Android开发自定义View

    Android中View组件的作用类似于Swing变成中的JPanel,它只是一个空白的矩形区域,View组件中没有任何内容.对于Android应用的其他UI组件来说,它们都继承了View组件,然后在 ...

  9. Android SDK 开发指南

    Android SDK 开发指南 视频详解 以下视频是对融云 Android SDK 开发使用的详细讲解,您可以在阅读文档时配合学习.   更多视频教程如下: CSDN 融云 Android SDK ...

随机推荐

  1. Swift - 关键字（typealias、associatedtype）

    Typealias typealias 是用来为已经存在的类型重新定义名字的,通过命名,可以使代码变得更加清晰.使用的语法也很简单,使用typealias 关键字像使用普通的赋值语句一样,可以将某个已 ...

  2. SQLServer Oracle MySQL的区别

    table tr:nth-child(odd){ background: #FFFFCC; font-size: 18px; } table tr:nth-child(even){ backgroun ...

  3. Centos7下 yum安装php扩展

    linux下, 使用thinkphp的模板标签,如 eq, gt, volist defined, present , empty等 标签时, 报错: used undefined function ...

  4. Python基础学习_01字符串的拼接（字符串的格式化输出）

    # 字符串的拼接 ---字符串的格式化输出 # 字符串的拼接 ---字符串的格式化输出 name = input("name:") age = input("age:&q ...

  5. POJ 1061 青蛙的约会（ 拓欧经典题 ）

    链接:传送门 思路:简单拓展欧几里德,分析后可以得到方程 x + m * t = y + n * t + L * s( s控制圈数,t代表跳t次会碰面 ),经过化简可以得到 ( n - m ) * t ...

  6. C#通过SendMessage发送消息，改变其他程序的下拉框控件（ComboBox）的值

    IntPtr cbh= new IntPtr(handle); //ComboBox的句柄 SendMessage(cbh, 0x014D, new IntPtr(-1), "需要选中的下拉 ...

  7. 【Codeforces Round #505 (rated, Div. 1 + Div. 2, based on VK Cup 2018 Final) C】

    [链接] 我是链接,点我呀:) [题意] 给你一个字符串s. 让你在其中的某一些位置进行操作.. 把[1..i]和[i+1..n]翻转. 使得里面01交替出现的那种子串的长度最长. [题解] 可以用a ...

  8. SpringBoot 配置 @ConfigurationProperties 与 @Value 区别

    一.SpringBoot 配置 @ConfigurationProperties 与 @Value 区别 配置文件 yml 还是 properties 他们都能获取到值: 如果说,我们只是在某个业务逻 ...

  9. ExtJs之Ext.XTemplate:数组填充，访问父对象

    <!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-equiv ...

  10. C#中的Attribute Property区别

    Attribute 一般译作"特性",Property 仍然译为"属性". Attribute 是一种可由用户自由定义的修饰符(Modifier),可以用来修饰 ...