分享插件的使用加一个echart走数据
html部分:
<div class="topLink clearfix bdsharebuttonbox bdshare-button-style0-16" data-bd-bind="1489453330399" style="display: block;">
<a class="fl" href="http://www.shumenol.com/index.html" target="_blank">官网</a>
<a class="fl" href="https://zhuce.shumenol.com/member/user_reg.aspx" target="_blank">注册</a>
<a class="fl" href="http://www.shumenol.com/html/download/" target="_blank">下载</a>
<a class="fl" href="http://bbs.shumenol.com/forum.php">论坛</a>
<a class="fl" href="javascript:;" data-cmd="more">分享+</a>
</div>
这里变红的地方是插件自带的必须加上
css部分
.bdselect_share_bg,.bdshare_popup_bg,.bdselect_share_box,.sr-bdimgshare,.bdshare_popup_box{display:none!important;}
js部分
//百度分享
window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"快来领取豪华福利吧!","bdMini":"2","bdPic":"","bdStyle":"0","bdSize":"16"},"share":{},"image":{"tag" : "noshareimg","viewList":["qzone","tsina","tqq","renren","weixin"],"viewText":"分享到:","viewSize":"16"},"selectShare":{"bdContainerClass":null,"bdSelectMiniList":["qzone","tsina","tqq","renren","weixin"]}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];
var deleteMk="0";
function deleteBdStyle(){
var links=$("link");
for(var i=0;i<links.length;i++){
if($(links.get(i)).attr("href").indexOf("share_style0_16.css")!=(-1)){
$(links.get(i)).remove();
deleteMk="1";
}
}
if(deleteMk=="0"){
setTimeout(function(){deleteBdStyle();},1000)
}else{
$(".topLink").show();//注意这个你是控制加了插件样式的容器的
}
}
deleteBdStyle();
如果你出现了以下BUG

那说明
.indexWrap .topLink{
position: absolute;
right:-16px;
top:2px;
width:211px;
height:34px;
line-height:34px;
font-family: "Microsoft yahei";
padding-left:6px;
background:url(../images/topBar_bg.png) no-repeat;
display:none;//你这个父容器没加隐藏,记住你js的else{里面控制了他的显示}
}
/*jquery echart.js走数据*/
<div class="form-group">
<div id="main" style="width: 100%;height:600px;"></div>
</div>
js部分
<script language="JavaScript">
var myChart = echarts.init(document.getElementById('main'));
function chart(){
$.ajax({
type:'get',
url:"${base}/platform/cms/statistics/countModel",
success:function(data){
var category=[];
var categoryNum=[];
for(var i=;i<data.length;i++){
category[i]=data[i].modelName;
categoryNum[i]=data[i].countNum;
}
myChart.setOption({
color: ['#3398DB'],
tooltip : {
trigger: 'axis',
axisPointer : { // 坐标轴指示器,坐标轴触发有效
type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis : [
{
type : 'category',
data : category,
axisTick: {
alignWithLabel: true
}
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
name:'访问量',
type:'bar',
barWidth: '60%',
data: categoryNum
}
]
})
}
})
}
</script>
分享插件的使用加一个echart走数据的更多相关文章
- 分享在Linux下使用OSGi.NET插件框架快速实现一个分布式服务集群的方法
在这篇文章我分享了如何使用分层与模块化的方法来设计一个分布式服务集群.这个分布式服务集群是基于DynamicProxy.WCF和OSGi.NET插件框架实现的.我将从设计思路.目标和实现三方面来描述. ...
- express4.0之后不会解析req.files,必须加一个插件multer
express 4 + 用multer express4.0之后不会解析req.files,必须加一个插件multer http://www.w3school.com.cn/tags/att_form ...
- 15 款 jQuery 社交分享插件
过去几年中社交媒体越来越流行了,能够分享音乐.视频.图像甚至是其他的 docs 文档到互联网上去,这样子还能够提高页面的点击量.通常,一些社交媒体插件都能允许你的用户分享你网站上的内容到其他的社交平台 ...
- iShare.js分享插件
iShare.js是一个小巧的分享插件,纯JS编写,不依赖任何第三方库,使用简便. 为啥写这个插件? 因为在搭建个人blog时(还没有搭建好(¯﹃¯)),对目前国内比较受欢迎的分享插件都不太满意,主要 ...
- ckplayer播放器去掉右边的开关灯分享插件
在上一篇文章中介绍了如何使用ckplayer播放器,但是有的人不需要CK播放器右边的开关灯分享插件,那么就需要把该插件给去掉,方法也很简单. 第一步:先打开ckplayer.js里找到下面三行删除掉 ...
- JiaThis WordPress分享插件安装全攻略
WordPress 是一个功能非常强大的博客系统,插件众多,易于扩充功能.安装和使用都非常方便.目前 WordPress 已经成为主流的 Blog 搭建平台.按照下面的方法,只需简单几步,就可轻松地将 ...
- 手动写的第一个eChart代码
手动写的第一个eChart代码 ,第一感觉,杂乱无章 <!doctype html> <html> <head> <meta charset="UT ...
- infinite-scroll插件无限滚动加载数据的使用
网上对于infinite-scroll插件使用的例子不多.但由于它的出现,鼓吹了瀑布流形式的页面展示方式,所以不得不了解了解这种新的分页方式. 官网上有对infinite-scroll的详细描述,但一 ...
- Framework7 索引列表插件的异步加载实现
前言 Framework7 作为移动端的开发框架的优良之处已经无需多言.现在已经有了 React 和 Vue 版本,之前在项目中用过 F7 + vue 的开发方式,无论是效率还是产出都近乎完美.有时间 ...
随机推荐
- KVM虚拟化技术(一)虚拟化简介
一 .虚拟化 虚拟化是指计算机元件在虚拟的基础上而不是真实的基础上运行.虚拟化技术可以扩大硬件的容量,简化软件的重新配置过程.CPU的虚拟化技术可以单CPU模 拟多CPU并行,允许一个平台同时运行多个 ...
- Android DevArt6:Android中IPC的六种方式
Android中IPC的六种方式 1.使用Bundle 最简单的进程间通信方式:Intent + Bundle: 支持三大组件:Activity.Service.BroadcastReceiver : ...
- ArcGIS案例学习笔记-中国2000坐标转换实例
ArcGIS案例学习笔记-中国2000坐标转换实例 联系方式:谢老师,135-4855-4328,xiexiaokui#qq.com 目的:西安1980.中国2000.WGS84(GPS)等任意坐标系 ...
- android资讯类软件框架《IT蓝豹》
android资讯类软件框架 android资讯类软件框架,支持侧滑,并且首页viewpager切换tab,tab滑动到最右侧的时候提示滑动结束, 滑动到最左侧的时候切换滑动侧滑menu.左滑和侧滑处 ...
- 学Android开发的人可以去的几个网站
学Android开发的人可以去的几个网站 1.<IT蓝豹>Android开源项目分享平台国内非常好的一个Android开发者分享站,分享android所有特效,每天都有最新的Android ...
- BOS物流项目第十一天(补充)
上节课我们在添加权限时,把选择父功能点做成这种效果,不太好,我们进行升级优化. 1.我们对jsp页面进行修改,主要是改了样式. 2.重新编写我们dao层的代码 3.在我们查看父项的时候自动查找子项,我 ...
- mysql 和 Oracle 数据类型对照
MySQL与Oracle两种数据库在工作中,都是用的比较多的数据库,由于MySQL与Oracle在数据类型上有部分差异,在我们迁移数据库时,会遇上一定的麻烦,下面介绍MySQL与Oracle数据库数据 ...
- MFC笔记1
1.在对话框文档中定义两个定时器,每间隔5秒弹出一个消息框提示“定时器1”,每隔5秒弹出一个消息框提示“定时器2” UINT ID_TIMER1 = 1 , ID_TIMER2 = 2; //设置 ...
- 从 mvc 到 REST
1. 理解MVC MVC是一种经典的设计模式,全名为Model-View-Controller,即模型-视图-控制器. 其中,模型是用于封装数据的载体,例如,在Java中一般通过一个简单的POJO(P ...
- 2.1、CDH 搭建Hadoop在安装(为Cloudera Manager配置存储库)
步骤1:为Cloudera Manager配置存储库 使用包管理工具安装Cloudera Manager yum 对于RHEL兼容系统, zypper对于SLES,和 apt-get对于Ubuntu. ...