<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script src="jquery-1.8.3.min.js"></script>

<script src="Highcharts/js/highcharts.js"></script>

</head>

<body>

<div id="container" style="width: 600px; height: 400px;"></div>

</body>

</html>

<script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>

<script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>

</textarea></li>

                <li class="con css"><textarea id="css"></textarea></li>

            </ul>

        </div>

    </div>

    <script type="text/javascript" src="http://img.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>

    <script type="text/javascript" src="http://img.hcharts.cn/highcharts/highcharts.js"></script>

    <script type="text/javascript" src="http://static.hcharts.cn/code/js/common.js"></script>

    <script type="text/javascript" src="http://static.hcharts.cn/code/js/codemirror.js"></script>

    <script type="text/javascript" src="http://static.hcharts.cn/code/js/javascript.js"></script>

    <script type="text/javascript" src="http://static.hcharts.cn/code/js/xml.js"></script>

    <script type="text/javascript" src="http://static.hcharts.cn/code/js/css.js"></script>

    <script type="text/javascript">

        var chart = null;

        var js = null;

        var html = null;

        var css = null;

         autoSize();

        table("result");

        $(".result_tables").find(".table").click(function(){

            var cla = $(this).data("index");

            table(cla);

        });

        window.onresize = autoSize;

        function loadResult(chart) {

            if(chart==null) {

               $(function () {

    $('#container').highcharts({

        title : {

            text : 'Customized legengItemClick Event'

        },

        plotOptions : {

            line : {

                events : {

                    legendItemClick : function(event) {

                        var series = this.chart.series;

                        var mode = getVisibleMode(series, this.name);

                        var enableDefault = false;

                        if (!this.visible) {

                            enableDefault = true;

                        }

                        else if (mode == 'all-visible') {

                            $.each(series, function(k, serie) {

                                serie.hide();

                            });

                            this.show();

                        }

                        else if (mode == 'all-hidden') {

                            $.each(series, function(k, serie) {

                                serie.show();

                            });

                        }

                        else {

                            enableDefault = true;

                        }

                        return enableDefault;

                    }

                }

            }

        },

        series : generateRandomSeries()

    });

});

function generateRandomSeries() {

    var series = [];

    for (var i = 0; i < 4; i++) {

        var data = new Array();

        for (var j = 0; j < 10; j++) {

            data.push(Math.random());

        }

        series.push({

            data : data

        });

    }

    return series;

};

function getVisibleMode(series, serieName) {

    var allVisible = true;

    var allHidden = true;

    for (var i = 0; i < series.length; i++) {

        if (series[i].name == serieName)

            continue;

        allVisible &= series[i].visible;

        allHidden &= (!series[i].visible);

    }

    if (allVisible && !allHidden)

        return 'all-visible';

    if (allHidden && !allVisible)

        return 'all-hidden';

    return 'other-cases';

};

            } else {

               chart.reflow();

            }

            return chart;

        }

    </script>

</body>

</html>

Highcharts 点击反选的更多相关文章

  1. highcharts点击事件系列

    http://www.highcharts.com/demo/line-ajax 参考设置(bar 柱状图) plotOptions: {                series: {       ...

  2. HighCharts点击柱形或饼块等加URL或Click事件

    我们在做图表的时候,有时候需要在单个数据上加链接或点击事件,是在plotOptions里的events里设置的: 如下代码: plotOptions: { pie: { cursor: 'pointe ...

  3. Highcharts 总结

    一.Highcharts  series属性 1.下面是一个基本曲线图的例子: <html> <head> <meta charset="UTF-8" ...

  4. jq实现全选、全不选、反选

    基本思路: 1全选:点击全选按钮的时候,将input的属性checked设置为true; 2全不选:点击全不选按钮的时候,将input的属性checked设置为false; 3反选:点击反选按钮的时候 ...

  5. Dom操作--全选反选

    我们经常会在网站上遇到一些多选的情况,下面我就来说说使用Dom写全选反选的思路. 全选思路:首先,我们来分析一下知道,当我们点击"全选"复选框的时候,所有的复选框应该都被选中,那我 ...

  6. jquery 书写全选反选功能

    书写一个后台管理中用到的全选反选功能.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  7. jQuery实现的全选、反选和不选功能

    适用于网页多选后需要进行批量操作的场景(如批量删除等).如有问题希望大家可以指正.谢谢~~ HTML 我们的页面上有一个歌曲列表,列出多行歌曲名称,并匹配复选框供用户选择,并且在列表下方有一排操作按钮 ...

  8. Android中购物车的全选、反选、问题和计算价格

    此Demo主要解决的是购物车中的全选,反选计算价格和选中的条目个数的问题,当选中几条时,点击反选,会把当先选中的变为不选中,把不选中的变为选中.点击全选会全部选中,再次点击时,变为全部不选中. //- ...

  9. jquery实现全选、全不选、反选、获取选中的所有值总结

    HTML 我们的页面上有一个歌曲列表,列出多行歌曲名称,并匹配复选框供用户选择,并且在列表下方有一排操作按钮. <!doctype html> <html> <head& ...

随机推荐

  1. ASIHTTPRequest使用指南---<<翻译稿>>

    ASIHTTPRequest使用指南---<<翻译稿>> 当第一次使用ASIHTTPRequest进行http请求时,会出现非常多的bug提示.查了一些资料,发现在少倒入了几个 ...

  2. [置顶] Android的IPC访问控制设计与实现

    3.3.1 IPC钩子函数设计与实现 IPC Binder是Android最重要的进程间通信机制,因此,必须在此实施强制访问控制. 1. 修改secuirty.h 打开终端shell,输入指令“cd ...

  3. MVC实现类似QQ的网页聊天功能-ajax（下）

    此篇文章主要是对MVC实现类似QQ的网页聊天功能(上)的部分代码的解释. 首先说一下显示框的滚动条置底的问题: 结构很简单一个大的div(高度一定.overflow:auto)包含着两个小的div第一 ...

  4. C#。总结

    数据类型--变量与常量--运算符与表达式--语句(if,for)--数组--函数--结构体一.数据类型: (一)内建类型 整型(int short long byte uint ushort ulon ...

  5. Java线程同步与死锁认识

    讲下自己的认识,算小小的总结吧! synchroized 具有同步线程的功能,它的处理机制类似于给参数里面的对象赋一个标记值,来表明当前状态,当程序里面某个线程执行synchroized里面的代码段时 ...

  6. HTML基础总结<链接>

    HTML 超链接(链接) HTML使用标签 <a>来设置超文本链接. 超链接可以是一个字,一个词,或者一组词,也可以是一幅图像,您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分. ...

  7. javascript 获取图片原始尺寸

    javascript 获取图片原始尺寸 function getImgInfo(url){ var img = new Image(), loaded = false; var info = {}; ...

  8. memcached全面剖析

    memcached介绍如今,越来越多的Web应用程序开始使用memcached这个高速的缓存服务器软件.然而,memcached的基础知识远远未能像其他Web技术那样普及,memcached在国内的大 ...

  9. PYTHON简介及安装

    Python简介 Python是一种广泛使用的高层次,通用,解释,动态编程语言.它的设计理念强调代码的可读性,它的语法允许程序员表达更少的代码的概念比将在可能语言如C ++或Java.该语言提供旨在使 ...

  10. 变量数据是怎么进ARM中的RAM中？

    这篇文章 是从网上复制过来的.觉得不错,分享给大家.原文地址:http://eetrend.com/forum/100028828 ARM的体系结构有很多很多介绍的地方,从其7种模式到CPSR状态寄存 ...