首页 >后端开发 >php教程 >有没有什么好的JavaScript地图控件可以实现根据数据量变色、链接等,另外需要修改脚本一则

有没有什么好的JavaScript地图控件可以实现根据数据量变色、链接等,另外需要修改脚本一则

WBOY
WBOY原创
2016-06-02 11:27:28974浏览

脚本地图javascript控件php

<code> <script type="text/javascript">$(function(){    var data = {"jiangsu":{"value":"<{$count5}>","stateInitColor":"4"},"heilongjiang":{"value":"<{$count4}>","stateInitColor":"3"},"henan":{"value":"<{$count2}>","stateInitColor":"0"},"anhui":{"value":"<{$count3}>","stateInitColor":"3"},"zhejiang":{"value":"<{$count9}>","stateInitColor":"4"},"beijing":{"value":"<{$count1}>","stateInitColor":"4"},"sichuan":{"value":"<{$count6}>","stateInitColor":"6"},"fujian":{"value":"<{$count8}>","stateInitColor":"5"},"gansu":{"value":"<{$count7}>","stateInitColor":"3"},"macau":{"value":"未知","stateInitColor":"7"},"hongkong":{"value":"未知","stateInitColor":"7"},"taiwan":{"value":"未知","stateInitColor":"7"},"xizang":{"value":"未知","stateInitColor":"7"}};            var i = 1;            for(k in data){                if(i <= 12){                    var _cls = i < 4 ? 'active' : '';                     $('#MapControl .list1').append('<li name="'+k+'"><div class="mapInfo"><i class="'+_cls+'">'+(i++)+'<span>'+chinaMapConfig.names[k]+'<b>'+data[k].value+'')                }else if(i <= 24){                    $('#MapControl .list2').append('<li name="'+k+'"><div class="mapInfo"><i>'+(i++)+'<span>'+chinaMapConfig.names[k]+'<b>'+data[k].value+'')                }else{                    $('#MapControl .list3').append('<li name="'+k+'"><div class="mapInfo"><i>'+(i++)+'<span>'+chinaMapConfig.names[k]+'<b>'+data[k].value+'')                }            }            var mapObj_1 = {};            var stateColorList = ['990a00', 'bf0c00', 'ee0e00', 'ff362a', 'ff7c74', 'ffd3d0', '#ffe4e1', 'ffffff'];            $('#RegionMap').SVGMap({                external: mapObj_1,                mapName: 'china',                mapWidth: 600,                mapHeight: 510,                stateData: data,                // stateTipWidth: 118,                // stateTipHeight: 47,                // stateTipX: 2,                // stateTipY: 0,                stateTipHtml: function (mapData, obj) {                    var _value = mapData[obj.id].value;                    var _idx = mapData[obj.id].value;                    var active = '';                    _idx < 4 ? active = 'active' : active = '';                    var tipStr = '<div class="mapInfo"><span>' + obj.name + '<b>' + _value + '';                    return tipStr;                }            });            $('#MapControl li').hover(function () {                var thisName = $(this).attr('name');                var thisHtml = $(this).html();                $('#MapControl li').removeClass('select');                $(this).addClass('select');                $(document.body).append('<div id="StateTip">');                $('#StateTip').css({                    left: $(mapObj_1[thisName].node).offset().left - 50,                    top: $(mapObj_1[thisName].node).offset().top - 40                }).html(thisHtml).show();                mapObj_1[thisName].attr({                    fill: '#E99A4D'                });            }, function () {                var thisName = $(this).attr('name');                $('#StateTip').remove();                $('#MapControl li').removeClass('select');                mapObj_1[$(this).attr('name')].attr({                    fill: "#" + stateColorList[data[$(this).attr('name')].stateInitColor]                });            });            $('#MapColor').show();    //  }    // });    $('#WorldMap').SVGMap({        mapName: 'world',        mapWidth: 600,        mapHeight: 400    });});</script></code>

上面是个地图脚本,jiangsu":{"value":"","stateInitColor":"4"}这是指江苏省的计数和变色,现在的色是4,希望修改成数据量超过1000的省份在这里显示6,数据量超过2千的显示5,跪求!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn