Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Avoid svg.call(t) #17

Open
riccardoscalco opened this issue Mar 25, 2015 · 4 comments
Open

Avoid svg.call(t) #17

riccardoscalco opened this issue Mar 25, 2015 · 4 comments

Comments

@riccardoscalco
Copy link
Owner

This issue is related to #7, in particular at the @bollwyvl comment

an element in an svg can always know its svg. Since these textures must be
singletons anyway a la #id, and since it can only ever drive "fill"... one
could remove the svg.call(t1) and t1.url(). Then it would just be
shape.call(t1), which would be much more d3-like. Under the hood, it would
selectAll("defs #some-texture-id", [t]) and then the whole enter/update
dance... But finally selection.style("fill", t.url()).

@jorgerobles
Copy link

jorgerobles commented Nov 18, 2016

Hi, I would like to use your library standalone (without using d3 full stack). Is there a way to do so?
Thanks!

@riccardoscalco
Copy link
Owner Author

At the moment the library depends on d3 and it cannot be used standalone. Consider that d3 4.x is now a collection of modules, therefore it should be possible to use textures with a minimal selection of those.

@jorgerobles
Copy link

Thank you!

@jeromew
Copy link
Contributor

jeromew commented Mar 8, 2017

@jorgerobles, for information I managed to "extract" textures from the module without d3 by using a minimal (quick&dirty) d3 mock.

module.exports = dom;

function dom(name) {
  this.name = name;
  this.els = [];
  this.attrs = {};
}

dom.prototype.append = function(name) {
  if (name === "defs") return this;
  if (this.name === undefined) {
    this.name = name;
    return this;
  }
  var el = new dom(name);
  this.els.push(el);
  return el;
}
dom.prototype.attr = function(key, value) {
  this.attrs[key] = value;
  return this;
}
dom.prototype.toString = function() {
  var attrs = [];
  var k;
  for (k in this.attrs) {
    attrs += " " + k + "='" + this.attrs[k] + "'";
  }
  if (this.els.length) {
    return "<"+this.name+attrs+">"+this.els.map(function(el) { return el.toString()}).join('\n')+"</"+this.name+">";
  } else {
    return "<"+this.name+attrs+"/>"
  }
}

use this with

var texture = textures.lines()
var sel = new dom();
texture(sel);
console.log(sel.toString())

this will output the svg pattern element.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants