Plugin Directory

Changeset 716592


Ignore:
Timestamp:
05/22/2013 10:53:16 AM (13 years ago)
Author:
thmufl
Message:

Update for axis left margin and 0 values in bubble charts

Location:
ipu-chart
Files:
6 edited
1 copied

Legend:

Unmodified
Added
Removed
  • ipu-chart/tags/0.6.2/ipu-chart.php

    r714394 r716592  
    55    Description: Creates D3/SVG based charts out of your comma- or tab-separated data. Currently supports bar, pie, donut, line, scatter, bubble and world map charts.
    66    Author: Thomas Müller Flury, ipublia
    7     Version: 0.6.1
     7    Version: 0.6.2
    88    Author URI: https://www.ipublia.com/author/thmufl/
    99    Text Domain: ipuchart
     
    5959        'title' => 'Set a title',
    6060        'description' => 'Set a description',
    61         'sort' => 'none',
     61        'sort' => 'true',
    6262        'interpolate' => 'linear',
    6363        'animate' => 'none',
  • ipu-chart/tags/0.6.2/js/ipu-chart.js

    r714394 r716592  
    213213    color = toArray(color);
    214214    animate = toArray(animate);
     215    sort = (sort.toLowerCase() == "true");
    215216   
    216217    if(animate[0] == "slow") animate = ["5000", "linear"];
     
    432433    var svg = figure.select("svg");
    433434   
    434     var margin = {top: 2, right: 2, bottom: 2, left: 2},
     435    var margin = {top: 8, right: 8, bottom: 8, left: 2},
    435436        width = parseInt(svg.attr("width")) - margin.left - margin.right,
    436437        height = parseInt(svg.attr("height")) - margin.top - margin.bottom;
    437438
    438439    var g = svg.select("g.main");
    439    
     440       
    440441    var pack = d3.layout.pack()
    441442        .size([width, height])
    442443        .padding(1.5)
    443444        .value(function(d) { return d[value[0]]; })
    444         .sort(null);
     445        .sort(function(a, b) { return sort ? d3.descending(a.value, b.value) : a.value });
    445446   
    446447    var data = { name: "root", children: data };
     
    451452        .attr("class", function(d) { return d.children ? "node" : "leaf node"; })
    452453        .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; })
     454        .style("opacity", function(d) { return d.r != 0 ? defaultOpacity : 0; })
    453455        .attr("d", function(d) { return d.__category = category; })
    454456        .attr("d", function(d) { return d.__value = value; });
     
    502504            .duration(3000)
    503505            .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; })
     506            .style("opacity", function(d) { return d[value[i]] != 0 ? defaultOpacity : 0; })
    504507            .select("circle")
    505                 .attr("r", function(d) { return d.r; });
     508                .attr("r", function(d) { return d.r; });               
    506509    }
    507510       
     
    525528    var svg = figure.select("svg");
    526529
    527     var margin = {top: 20, right: 20, bottom: 40, left: 80},
     530    var margin = {top: 20, right: 20, bottom: 40, left: d3.max(data, function(d) { return 8 * d[value[1]].toString().length; })},
    528531        width = parseInt(svg.attr("width")) - margin.left - margin.right,
    529532        height = parseInt(svg.attr("height")) - margin.top - margin.bottom;
     
    538541        .scale(x)
    539542        .orient("bottom")
    540         .tickSize(height);
     543        .tickSize(height)
     544        .ticks(8);
    541545
    542546    var yAxis = d3.svg.axis()
     
    623627   
    624628    var svg = figure.select("svg");
    625 
    626     var margin = {top: 20, right: 20, bottom: 40, left: 80},
     629   
     630    var margin = {top: 20, right: 10, bottom: 40, left: d3.max(data, function(d) { return 8*d[value].toString().length; })},
    627631        width = parseInt(svg.attr("width")) - margin.left - margin.right,
    628632        height = parseInt(svg.attr("height")) - margin.top - margin.bottom;
     
    637641        .scale(x)
    638642        .orient("bottom")
    639         .tickSize(height);
     643        .tickSize(height)
     644        .ticks(8);
    640645
    641646    var yAxis = d3.svg.axis()
     
    652657    y.domain(d3.extent(data, function(d) { return d[value]; }));
    653658
    654     var chart = svg.append("g")
     659    var chart = svg.select(".main").append("g")
    655660        .attr("class", "chart")
    656661        .attr("transform", "translate(" + margin.left + "," + margin.top + ")");   
     
    694699            .attr("cy", function(d) { return y(d[value]); })
    695700            .attr("opacity", 0.0);
    696        
     701   
    697702    if(touch_device) {
    698703        d3.selectAll(".dot")
     
    714719    var svg = figure.select("svg");
    715720
    716     var margin = {top: 20, right: 20, bottom: 40, left: 80},
     721    var margin = {top: 20, right: 20, bottom: 40, left: d3.max(data, function(d) { return 8*d[value].toString().length; })},
    717722        width = parseInt(svg.attr("width")) - margin.left - margin.right,
    718723        height = parseInt(svg.attr("height")) - margin.top - margin.bottom;
     
    824829   
    825830    var svg = figure.select("svg");
    826 
    827     var margin = {top: 20, right: 20, bottom: 40, left: 80},
     831   
     832    var margin = {top: 20, right: 30, bottom: 40, left: d3.max(data, function(d) { return 6*d[category].toString().length; })},
    828833        width = parseInt(svg.attr("width")) - margin.left - margin.right,
    829834        height = parseInt(svg.attr("height")) - margin.top - margin.bottom;
     
    838843        .scale(x)
    839844        .orient("bottom")
    840         .tickSize(height);
     845        .tickSize(height)
     846        .ticks(6);
    841847
    842848    var yAxis = d3.svg.axis()
  • ipu-chart/tags/0.6.2/readme.txt

    r714425 r716592  
    44Requires at least: 3.0.1
    55Tested up to: 3.5.1
    6 Stable tag: 0.6.1
     6Stable tag: 0.6.2
    77License: GPLv2 or later
    88License URI: http://www.gnu.org/licenses/gpl-2.0.html
    99
    10 Creates animated bar, pie, donut, line, scatter, bubble and world map charts out of your data. A d3/svg based shortcode with editor support.
     10Creates SVG based, animated bar, pie, donut, line, scatter, bubble and world map charts out of your spreadsheet data. A powerful, easy to use shortcode. And even easier with the free [IPU-Chart Editor Online](https://www.ipublia.com/support/ipu-chart-editor-online/)!
    1111
    1212== Description ==
     
    168168* Minor update for interoperability with the editor.
    169169
     170= 0.6.2 =
     171* Better calculation of left margin for bar, scatter and line charts
     172* Update for bubble charts with 0 values in the data series
     173* Sor for bubble charts
     174
    170175== Upgrade Notice ==
    171176
     
    206211* Minor update for the interoperability with the IPU-Chart Editor
    207212
    208 
     213= 0.6.2 =
     214* Better calculation of left margin for bar, scatter and line charts
     215* Update for bubble charts with 0 values in the data series
     216* Sor for bubble charts
     217
     218
  • ipu-chart/trunk/ipu-chart.php

    r714394 r716592  
    55    Description: Creates D3/SVG based charts out of your comma- or tab-separated data. Currently supports bar, pie, donut, line, scatter, bubble and world map charts.
    66    Author: Thomas Müller Flury, ipublia
    7     Version: 0.6.1
     7    Version: 0.6.2
    88    Author URI: https://www.ipublia.com/author/thmufl/
    99    Text Domain: ipuchart
     
    5959        'title' => 'Set a title',
    6060        'description' => 'Set a description',
    61         'sort' => 'none',
     61        'sort' => 'true',
    6262        'interpolate' => 'linear',
    6363        'animate' => 'none',
  • ipu-chart/trunk/js/ipu-chart.js

    r714394 r716592  
    213213    color = toArray(color);
    214214    animate = toArray(animate);
     215    sort = (sort.toLowerCase() == "true");
    215216   
    216217    if(animate[0] == "slow") animate = ["5000", "linear"];
     
    432433    var svg = figure.select("svg");
    433434   
    434     var margin = {top: 2, right: 2, bottom: 2, left: 2},
     435    var margin = {top: 8, right: 8, bottom: 8, left: 2},
    435436        width = parseInt(svg.attr("width")) - margin.left - margin.right,
    436437        height = parseInt(svg.attr("height")) - margin.top - margin.bottom;
    437438
    438439    var g = svg.select("g.main");
    439    
     440       
    440441    var pack = d3.layout.pack()
    441442        .size([width, height])
    442443        .padding(1.5)
    443444        .value(function(d) { return d[value[0]]; })
    444         .sort(null);
     445        .sort(function(a, b) { return sort ? d3.descending(a.value, b.value) : a.value });
    445446   
    446447    var data = { name: "root", children: data };
     
    451452        .attr("class", function(d) { return d.children ? "node" : "leaf node"; })
    452453        .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; })
     454        .style("opacity", function(d) { return d.r != 0 ? defaultOpacity : 0; })
    453455        .attr("d", function(d) { return d.__category = category; })
    454456        .attr("d", function(d) { return d.__value = value; });
     
    502504            .duration(3000)
    503505            .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; })
     506            .style("opacity", function(d) { return d[value[i]] != 0 ? defaultOpacity : 0; })
    504507            .select("circle")
    505                 .attr("r", function(d) { return d.r; });
     508                .attr("r", function(d) { return d.r; });               
    506509    }
    507510       
     
    525528    var svg = figure.select("svg");
    526529
    527     var margin = {top: 20, right: 20, bottom: 40, left: 80},
     530    var margin = {top: 20, right: 20, bottom: 40, left: d3.max(data, function(d) { return 8 * d[value[1]].toString().length; })},
    528531        width = parseInt(svg.attr("width")) - margin.left - margin.right,
    529532        height = parseInt(svg.attr("height")) - margin.top - margin.bottom;
     
    538541        .scale(x)
    539542        .orient("bottom")
    540         .tickSize(height);
     543        .tickSize(height)
     544        .ticks(8);
    541545
    542546    var yAxis = d3.svg.axis()
     
    623627   
    624628    var svg = figure.select("svg");
    625 
    626     var margin = {top: 20, right: 20, bottom: 40, left: 80},
     629   
     630    var margin = {top: 20, right: 10, bottom: 40, left: d3.max(data, function(d) { return 8*d[value].toString().length; })},
    627631        width = parseInt(svg.attr("width")) - margin.left - margin.right,
    628632        height = parseInt(svg.attr("height")) - margin.top - margin.bottom;
     
    637641        .scale(x)
    638642        .orient("bottom")
    639         .tickSize(height);
     643        .tickSize(height)
     644        .ticks(8);
    640645
    641646    var yAxis = d3.svg.axis()
     
    652657    y.domain(d3.extent(data, function(d) { return d[value]; }));
    653658
    654     var chart = svg.append("g")
     659    var chart = svg.select(".main").append("g")
    655660        .attr("class", "chart")
    656661        .attr("transform", "translate(" + margin.left + "," + margin.top + ")");   
     
    694699            .attr("cy", function(d) { return y(d[value]); })
    695700            .attr("opacity", 0.0);
    696        
     701   
    697702    if(touch_device) {
    698703        d3.selectAll(".dot")
     
    714719    var svg = figure.select("svg");
    715720
    716     var margin = {top: 20, right: 20, bottom: 40, left: 80},
     721    var margin = {top: 20, right: 20, bottom: 40, left: d3.max(data, function(d) { return 8*d[value].toString().length; })},
    717722        width = parseInt(svg.attr("width")) - margin.left - margin.right,
    718723        height = parseInt(svg.attr("height")) - margin.top - margin.bottom;
     
    824829   
    825830    var svg = figure.select("svg");
    826 
    827     var margin = {top: 20, right: 20, bottom: 40, left: 80},
     831   
     832    var margin = {top: 20, right: 30, bottom: 40, left: d3.max(data, function(d) { return 6*d[category].toString().length; })},
    828833        width = parseInt(svg.attr("width")) - margin.left - margin.right,
    829834        height = parseInt(svg.attr("height")) - margin.top - margin.bottom;
     
    838843        .scale(x)
    839844        .orient("bottom")
    840         .tickSize(height);
     845        .tickSize(height)
     846        .ticks(6);
    841847
    842848    var yAxis = d3.svg.axis()
  • ipu-chart/trunk/readme.txt

    r714425 r716592  
    44Requires at least: 3.0.1
    55Tested up to: 3.5.1
    6 Stable tag: 0.6.1
     6Stable tag: 0.6.2
    77License: GPLv2 or later
    88License URI: http://www.gnu.org/licenses/gpl-2.0.html
    99
    10 Creates animated bar, pie, donut, line, scatter, bubble and world map charts out of your data. A d3/svg based shortcode with editor support.
     10Creates SVG based, animated bar, pie, donut, line, scatter, bubble and world map charts out of your spreadsheet data. A powerful, easy to use shortcode. And even easier with the free [IPU-Chart Editor Online](https://www.ipublia.com/support/ipu-chart-editor-online/)!
    1111
    1212== Description ==
     
    168168* Minor update for interoperability with the editor.
    169169
     170= 0.6.2 =
     171* Better calculation of left margin for bar, scatter and line charts
     172* Update for bubble charts with 0 values in the data series
     173* Sor for bubble charts
     174
    170175== Upgrade Notice ==
    171176
     
    206211* Minor update for the interoperability with the IPU-Chart Editor
    207212
    208 
     213= 0.6.2 =
     214* Better calculation of left margin for bar, scatter and line charts
     215* Update for bubble charts with 0 values in the data series
     216* Sor for bubble charts
     217
     218
Note: See TracChangeset for help on using the changeset viewer.