Skip to content

[feature] Add setting to enable user to create custom symbols#17

Merged
afucher merged 2 commits intomainfrom
custom-symbol
Apr 6, 2022
Merged

[feature] Add setting to enable user to create custom symbols#17
afucher merged 2 commits intomainfrom
custom-symbol

Conversation

@afucher
Copy link
Contributor

@afucher afucher commented Apr 6, 2022

The settings now will have a new attribute CUSTOM_SYMBOL_FN that will receive the same parameters that the internal getSymbol receives and in addition the context element.

Example creating a custom svg element

function custom_symbol(name, x, y, context) {
  console.log(name, x, y);
  const symbol = document.createElementNS(context.root.namespaceURI, 'circle')
  symbol.setAttribute('cx', x - astrology.SIGNS_STROKE)
  symbol.setAttribute('cy', y - astrology.SIGNS_STROKE)
  symbol.setAttribute('width', '20px')
  symbol.setAttribute('height', '20px')
  symbol.setAttribute('r', '10')
  symbol.setAttribute('fill', 'blue')
  return symbol;
}
window.onload = function () {
  var chart = new astrology.Chart('paper', 600, 600, {CUSTOM_SYMBOL_FN: custom_symbol});  
  chart.radix( data).aspects();
};

Example with image from a external source

function custom_symbol(name, x, y, context) {
  console.log(name, x, y);
  if(name == astrology.SYMBOL_MARS) return null; // null or undefined will fallback to the defaul implemetation
  const symbol = document.createElementNS(context.root.namespaceURI, 'image')
  symbol.setAttribute('href', 'http://localhost:8080/assets/Sun.svg')
  symbol.setAttribute('x', x - 10)
  symbol.setAttribute('y', y - 10)
  symbol.setAttribute('width', '20px')
  symbol.setAttribute('height', '20px')
  return symbol;
}
window.onload = function () {
  var chart = new astrology.Chart('paper', 600, 600, {CUSTOM_SYMBOL_FN: custom_symbol});
  chart.radix(data).aspects();
};

closes #5

@afucher afucher merged commit 6eb7cee into main Apr 6, 2022
@afucher afucher deleted the custom-symbol branch April 6, 2022 23:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Support custom symbol sign settings

1 participant