基于amcharts插件3D柱状图效果

下载地址

var chart = AmCharts.makeChart("chartdiv", { "theme": "none", "type": "serial", "startDuration": 2, "dataProvider": [{ "country": "USA", "visits": 4025, "color": "#FF0F00" }, { "country": "China", "visits": 1882, "color": "#FF6600" }, { "country": "Japan", "visits": 1809, "color": "#FF9E01" }, { "country": "Germany", "visits": 1322, "color": "#FCD202" }, { "country": "UK", "visits": 1122, "color": "#F8FF01" }, { "country": "France", "visits": 1114, "color": "#B0DE09" }, { "country": "India", "visits": 984, "color": "#04D215" }, { "country": "Spain", "visits": 711, "color": "#0D8ECF" }, { "country": "Netherlands", "visits": 665, "color": "#0D52D1" }, { "country": "Russia", "visits": 580, "color": "#2A0CD0" }, { "country": "South Korea", "visits": 443, "color": "#8A0CCF" }, { "country": "Canada", "visits": 441, "color": "#CD0D74" }, { "country": "Brazil", "visits": 395, "color": "#754DEB" }, { "country": "Italy", "visits": 386, "color": "#DDDDDD" }, { "country": "Australia", "visits": 384, "color": "#999999" }, { "country": "Taiwan", "visits": 338, "color": "#333333" }, { "country": "Poland", "visits": 328, "color": "#000000" }], "valueAxes": [{ "position": "left", "axisAlpha":0, "gridAlpha":0 }], "graphs": [{ "balloonText": "[[category]]: [[value]]", "colorField": "color", "fillAlphas": 0.85, "lineAlpha": 0.1, "type": "column", "topRadius":1, "valueField": "visits" }], "depth3D": 40, "angle": 30, "chartCursor": { "categoryBalloonEnabled": false, "cursorAlpha": 0, "zoomable": false }, "categoryField": "country", "categoryAxis": { "gridPosition": "start", "axisAlpha":0, "gridAlpha":0 }, "exportConfig":{ "menuTop":"20px", "menuRight":"20px", "menuItems": [{ "icon": "/lib/3/images/export.png", "format": "png" }] }},0);jQuery(".chart-input").off().on("input change",function() { var property = jQuery(this).data("property"); var target = chart; chart.startDuration = 0; if ( property == "topRadius") { target = chart.graphs[0]; } target[property] = this.value; chart.validateNow();});

dd: