Skip to content

Instantly share code, notes, and snippets.

@jugglebird
Created April 11, 2013 16:56
Show Gist options
  • Select an option

  • Save jugglebird/5365132 to your computer and use it in GitHub Desktop.

Select an option

Save jugglebird/5365132 to your computer and use it in GitHub Desktop.

Revisions

  1. jugglebird revised this gist Apr 11, 2013. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions _.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    [ <a href="http://tributary.io/inlet/5365132">Launch: Word wrap with foreignObject</a> ] 5365132 by jugglebird<br>[ <a href="http://tributary.io/inlet/5320723">Launch: SVG resize to containe</a> ] 5320723 by biovisualize<br>[ <a href="http://tributary.io/inlet/5052807">Launch: SVG resize to containe</a> ] 5052807 by biovisualize<br>[ <a href="http://tributary.io/inlet/4268238">Launch Inlet</a> ]<br/><a href="https://gist.github.com/3200444">Gist #3200444</a>
  2. jugglebird created this gist Apr 11, 2013.
    1 change: 1 addition & 0 deletions config.json
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    {"description":" Word wrap with foreignObject","endpoint":"","display":"div","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"tab":"edit","display_percent":0.7,"hidepanel":true}
    32 changes: 32 additions & 0 deletions inlet.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,32 @@
    // Change the size here to see it wrap
    var w = 541
    var h = 377;

    var div = d3.select("#display")
    .append('div')
    .style({background: 'aliceblue',
    width: w + 'px',
    height: h + 'px'
    });

    var svg = div.append("svg")
    .attr({width: w, height: h});

    svg.append("foreignObject")
    .attr({width: w, height: h})
    .append("xhtml:body")
    .append("xhtml:div")
    .style({width: w + 'px',
    height: h + 'px',
    "font-size": "20px",
    "background-color": "white"
    })
    .html("“I can't believe I've been passed over for Long John Silver,” said Mr. Molesley. The lawn introduced the doctor. A poor man made sport of Highclere Castle. “Well we could always start with Mrs Crawley and Lady Grantham,” informed Mrs. Levinson. “Not worse than a maid serving a duke,” argued Mr. Mason.");

    svg.append('circle')
    .attr({cx: w/2,
    cy: h/2,
    r: Math.min(w, h)/2,
    fill: "none",
    stroke: "dodgerblue"
    });