Angularjs中添加HighCharts
一. 添加基本配置
1. 添加指令
angular.module('newApp')
.directive('dpHighchart', ['$rootScope', function($rootScope){
return {
restrict: 'E',
scope: {
chartConfig: "="
},
link: function ($scope, element, $attr) {
$scope.$watch('chartConfig', function (newValue, oldValue) {
if (newValue) {
$(element).highcharts($scope.chartConfig);
}
});
}
}
}])
2. 添加CSS样式
dp-highchart {
display: block;
}
二. 使用方法
1. html中添加一行。
<dp-highchart chart-config="chartConfig1"></dp-highchart>
2. JS中添加一句。
$scope.chartConfig1 = object(chart配置对象);
Angularjs中添加HighCharts的更多相关文章
- Angularjs中添加ckEditor插件
使用方法看注释.主要解决帮上ngModel的问题 angular.module('newApp') .directive('ckeEditor', function() { return { /* F ...
- 在AngularJS中的使用Highcharts图表控件
一.Highcharts简介 Highcharts是一款非常好用的前端图表控件,正如其中文网介绍的那样:功能强大.开源.美观.图表丰富.兼容绝大多数浏览器的纯js图表库. 如果你的项目是基于jquer ...
- AngularJS中get请求URL出现跨域问题
今天早上帮助同学看了一个AngularJS的问题,主要是请求中出现了跨域访问,请求被阻止. 下面是她给我的代码: <html lang="en" ng-app="m ...
- AngularJS中的表单验证
AngularJS中的表单验证 AngularJS自带了很多验证,什么必填,最大长度,最小长度...,这里记录几个有用的正则式验证 1.使用angularjs的表单验证 正则式验证 只需要配置一个正则 ...
- 初次使用AngularJS中的ng-view,路由控制
AngularJS中的route可以控制页面元素的改变,使多页面变成一个单页面 第一步:引入必要的js: <script src="js/lib/angular.js"> ...
- AngularJS中的指令全面解析(转载)
说到AngularJS,我们首先想到的大概也就是双向数据绑定和指令系统了,这两者也是AngularJS中最为吸引人的地方.双向数据绑定呢,感觉没什么好说的,那么今天我们就来简单的讨论下AngularJ ...
- 在AngularJs中怎么设置请求头信息(headers)及不同方法的比较
在AngularJS中有三种方式可以设置请求头信息: 1.在http服务的在服务端发送请求时,也就是调用http()方法时,在config对象中设置请求头信息:事例如下: $http.post('/s ...
- 【Openlayers3】在地图上添加highcharts图表
今天试用了一下ol3,效果很是不错! ol3中有个ol.Overlay,使用这个类我们可以在地图中添加各种html要素. 下面我们在地图中添加一个饼图 html中添加一个div容器: <div ...
- AngularJS中的指令
欢迎大家讨论与指导 : ) 前言 当AngularJS中的内置指令不能满足我们的需求,或者当我们需要创建一个能够用于多个AngularJS程序的自包含的功能单元时,我们应该创建自定义指令来满足需求. ...
随机推荐
- 如何上传文件到 github
1. 下载并安装 Git 2. 打开命令窗口:Git Bash Here 3. 在 github.coding 等上新建项目,并复制地址,如:https://git.coding.net/wangzh ...
- Spring Boot (32) Lock 本地锁
平时开发中,有时会双击提交表单造成重复提交,或者网速比较慢时还没有响应又点击了按钮,我们在开发中必须防止重复提交 一般在前台进行处理,定义个变量,发送请求前判断变量值为true,然后把变量设置为fal ...
- Disruptor源码解读
上一篇已经介绍了Disruptor是什么?简单总结了为什么这么快?下面我们直接源码搞起来,简单粗暴.高性能队列disruptor为什么这么快? 一.核心类接口 Disruptor 提供了对RingBu ...
- .Net实战之反射操作篇
1.上一讲中描述了反射中常见的类,仅仅是描述类与反射之间的关系. 但是实际是对数据的操作, 在反射中,数据如何操作? [MyTable("T_UserInfo")] publ ...
- 诊断Java中的内存泄露
每次我怀疑有内存泄漏时,我都要翻箱倒柜找这些命令.所以,这里总结一下以备后用: 首先,我用下面的命令监视进程: 1 while ( sleep 1 ) ; do ps -p $PID -o %cpu, ...
- IDEA打可执行jar包
流程: 1. File ->Project Structure -> Artifacts -> + -> JAR -> From modules with depende ...
- npm——nrm
nrm 是镜像地址,方便国内下载 npm i nrm -g nrm ls nrm use taobao // 切换地址
- poi导出word时设置兼容性
接上一篇poi导出word http://www.cnblogs.com/xiufengd/p/4708680.html. public static void setAuto(XWPFDocumen ...
- UI布局只关乎三件事情:尺寸、位置、组织
UI布局只关乎三件事情:尺寸.位置.组织. 组织分为两类: 单元组织: 集合组织: 混合组织.
- 【原】SMTP发送邮件
1.下载class.phpmailer.php和class.smtp.php至公共库 2.编写发邮件的公共函数 function sendMail($param) { $config = C('THI ...