chainwaytsp

### 资源地址：
traceplay /js/jquery-1.8.3.min.js（第三方资源）
traceplay/TracePlayWidget.js
traceplay/API.js

### 演示包下载:
[点击下载](http://www.chainwaytsp.cn/api/openpage_v1_92.zip "点击下载")

展示效果如图

![](http://www.chainwaytsp.cn/api/Public/Uploads/2017-06-09/593a54bbd59ba.jpg)

### Demo示例：
- 1.引入资源（资源可以下载到本地）
```html
<script type="text/javascript" src=" traceplay /js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="traceplay/TracePlayWidget.js"></script>
<script type="text/javascript" src="traceplay/API.js"></script>
```

- 2.创建容器
```html
<div id="container">
</div>
```

- 3.渲染组件

```javascript
<script type="text/javascript">
(function(){
	var widget=TracePlayWidget.create("container",{
		merchantId:"100000",//商户Id
		userName:"jasion_api",//请求用户名
		/*css的样式配置是可选的*/
		css:{carIcon:"http://127.0.0.1:8080/openPage/ui/traceplay/images/ico_car_on.png"},
		getQueryVehicleParam:function(merchantId,userName,requestTime,plateNo,excute){
			//TODO 暴露出去的查询方法，用户要自己实现，因为查询的参数需要加密
		},
		getQueryTraceParam:function(merchantId,userName,requestTime,vehicleId,startTime,endTime,excute){
			//TODO 暴露出去的查询方法，用户要自己实现，因为查询的参数需要加密
		}
	});
})();
</script>

```

getQueryVehicleParam, getQueryTraceParam这两个函数是需要用户自己实现的后台加密处理
例如：
```javascript
getQueryVehicleParam:function(merchantId,userName,requestTime,plateNo,excute){
			//暴露出去的查询方法，用户要自己实现，因为查询的参数需要加密
			var param={
				merchantId:merchantId,
				userName:userName,
				requestTime:requestTime,
				plateNo:plateNo
			};
			$.ajax({
				type:"POST",
				url:"http://127.0.0.1:8087/SSO/md5/getVehicleListParamMD5",
				dataType:"json",
				data:param,
				success:function(result){
					var sign=result.sign;
					param.sign=sign;
					if(excute){
						excute(param);
					}
				},
				error:function(XMLHttpRequest, textStatus, errorThrown){ 
}
			});
		}
```

通过ajax经后台加密后，得到加密的请求参数后，再执行查询成为的业务数据
excute(param)
后台的加密方式实现及加密密钥，我们会通过邮件告知对方。

### 组件参数说明

|参数名称|类型|说明|备注|
|:----    |:-------    |:--- |------      |
|merchantId  |String     |商户Id	|必填  |
|userName |String |请求用户名|必填|
|css |Json |定制样式|	 可选 |
|css. carIcon    |String |轨迹线上小车图标，没有就是默认图标  |可选  |

轨迹播放开放页面