{"action":"created","issue":{"url":"https://api.github.com/repos/codeforkansascity/People-Hub/issues/2","labels_url":"https://api.github.com/repos/codeforkansascity/People-Hub/issues/2/labels{/name}","comments_url":"https://api.github.com/repos/codeforkansascity/People-Hub/issues/2/comments","events_url":"https://api.github.com/repos/codeforkansascity/People-Hub/issues/2/events","html_url":"https://github.com/codeforkansascity/People-Hub/issues/2","id":95101386,"number":2,"title":"Open source timeline","user":{"login":"tangospring","id":10410203,"avatar_url":"https://avatars.githubusercontent.com/u/10410203?v=3","gravatar_id":"","url":"https://api.github.com/users/tangospring","html_url":"https://github.com/tangospring","followers_url":"https://api.github.com/users/tangospring/followers","following_url":"https://api.github.com/users/tangospring/following{/other_user}","gists_url":"https://api.github.com/users/tangospring/gists{/gist_id}","starred_url":"https://api.github.com/users/tangospring/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tangospring/subscriptions","organizations_url":"https://api.github.com/users/tangospring/orgs","repos_url":"https://api.github.com/users/tangospring/repos","events_url":"https://api.github.com/users/tangospring/events{/privacy}","received_events_url":"https://api.github.com/users/tangospring/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":3,"created_at":"2015-07-15T04:10:25Z","updated_at":"2015-09-05T16:30:34Z","closed_at":null,"body":"* Timeline from KnightLab can use either Google Doc spreadsheet or Json file, version 3.0 allows multiple timelines per page http://timeline3.knightlab.com/, on GitHub: https://github.com/NUKnightLab/TimelineJS \r\nCan the image preview panel be switched off?\r\n* Simile Widgets timeline: http://www.simile-widgets.org/timeline/\r\nCan use custom icons for events?\r\n* Google timeline: https://developers.google.com/chart/interactive/docs/gallery/timeline \r\nIcons can be used as background attribute, where the length of the bar is preset to the width of a single icon. \r\n\r\nAre any of these capable to represent this wireframe?\r\n![team journey wireframe](https://cloud.githubusercontent.com/assets/10410203/8690057/2b1b5628-2a75-11e5-8d9b-e25d818caa67.png)"},"comment":{"url":"https://api.github.com/repos/codeforkansascity/People-Hub/issues/comments/137972787","html_url":"https://github.com/codeforkansascity/People-Hub/issues/2#issuecomment-137972787","issue_url":"https://api.github.com/repos/codeforkansascity/People-Hub/issues/2","id":137972787,"user":{"login":"QuestofIranon","id":2449351,"avatar_url":"https://avatars.githubusercontent.com/u/2449351?v=3","gravatar_id":"","url":"https://api.github.com/users/QuestofIranon","html_url":"https://github.com/QuestofIranon","followers_url":"https://api.github.com/users/QuestofIranon/followers","following_url":"https://api.github.com/users/QuestofIranon/following{/other_user}","gists_url":"https://api.github.com/users/QuestofIranon/gists{/gist_id}","starred_url":"https://api.github.com/users/QuestofIranon/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/QuestofIranon/subscriptions","organizations_url":"https://api.github.com/users/QuestofIranon/orgs","repos_url":"https://api.github.com/users/QuestofIranon/repos","events_url":"https://api.github.com/users/QuestofIranon/events{/privacy}","received_events_url":"https://api.github.com/users/QuestofIranon/received_events","type":"User","site_admin":false},"created_at":"2015-09-05T16:30:34Z","updated_at":"2015-09-05T16:30:34Z","body":"It looks like maybe the part of the code that specifies drawing circles could be modified. I think you could modify the following to use svg images instead of circles based on some searching I did.\r\n\r\n```\r\n        d3.select(this).selectAll('circle').remove();\r\n\r\n        var circle = d3.select(this).selectAll('circle')\r\n          .data(function(d) {\r\n            // filter value outside of range\r\n            return filterData(d.dates, config.xScale);\r\n          });\r\n\r\n        circle.enter()\r\n          .append('circle')\r\n          .attr('cx', function(d) {\r\n            return config.xScale(d);\r\n          })\r\n          .style('fill', config.eventColor)\r\n          .attr('cy', -5)\r\n          .attr('r', 10)\r\n        ;\r\n\r\n        circle.exit().remove();\r\n```"}}