{"action":"created","issue":{"url":"https://api.github.com/repos/marmelab/EventDrops/issues/267","repository_url":"https://api.github.com/repos/marmelab/EventDrops","labels_url":"https://api.github.com/repos/marmelab/EventDrops/issues/267/labels{/name}","comments_url":"https://api.github.com/repos/marmelab/EventDrops/issues/267/comments","events_url":"https://api.github.com/repos/marmelab/EventDrops/issues/267/events","html_url":"https://github.com/marmelab/EventDrops/issues/267","id":442821424,"node_id":"MDU6SXNzdWU0NDI4MjE0MjQ=","number":267,"title":"Dynamic Event Drop Color Value Switches on Zoom","user":{"login":"Rheisen","id":7832815,"node_id":"MDQ6VXNlcjc4MzI4MTU=","avatar_url":"https://avatars2.githubusercontent.com/u/7832815?v=4","gravatar_id":"","url":"https://api.github.com/users/Rheisen","html_url":"https://github.com/Rheisen","followers_url":"https://api.github.com/users/Rheisen/followers","following_url":"https://api.github.com/users/Rheisen/following{/other_user}","gists_url":"https://api.github.com/users/Rheisen/gists{/gist_id}","starred_url":"https://api.github.com/users/Rheisen/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Rheisen/subscriptions","organizations_url":"https://api.github.com/users/Rheisen/orgs","repos_url":"https://api.github.com/users/Rheisen/repos","events_url":"https://api.github.com/users/Rheisen/events{/privacy}","received_events_url":"https://api.github.com/users/Rheisen/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":2,"created_at":"2019-05-10T17:30:12Z","updated_at":"2019-05-10T17:37:05Z","closed_at":null,"author_association":"NONE","body":"**What you were expecting:**\r\n\r\nI'm creating an event dropper chart for messaging information, and one thing attached to messages is a sentiment score. The score values are from [-1,1] and I'd like to set the event drop color to scale from red to green depending on the score value.\r\n\r\n```\r\ndrop: {\r\n          date: (data: any) => data.date,\r\n          color: (data : any) => this.renderDropColor(data),\r\n          ...\r\n}\r\n\r\nrenderDropColor(data: any) {\r\n    if (typeof data.eventData.dropColor === 'undefined') {\r\n      if (data.eventData.type === 'sentimentScore') {\r\n        const score = data.eventData.sentimentScore;\r\n        const redVal = score <= 0 ? 255 : Math.round(255 - Math.abs(255 * score));\r\n        const greenVal = score >= 0 ? 255 : Math.round(255 - Math.abs(255 * score));\r\n        data.eventData.dropColor = `rgba(${redVal}, ${greenVal}, 0, 1)`;\r\n      } else {\r\n        data.eventData.dropColor = '';\r\n      }\r\n    }\r\n    return data.eventData.dropColor;\r\n}\r\n```\r\n\r\nThis code works initially and sets the event drop color as expected.\r\n\r\n<!-- Describe what the behavior would be without the bug. -->\r\n\r\n**What happened instead:**\r\n\r\n<!-- Describe how the bug manifests. -->\r\n\r\nWhen zooming in or out on the data set, however, the drop color values shift around. My best determination is that when a drop disappears off the edges of the chart the color value of that event drop for some reason moves onto nearby event drops that are still rendered in the display.\r\n\r\n**Steps to reproduce:**\r\n\r\n<!--  Please explain the steps required to duplicate the issue, especially if you are able to provide a sample application. -->\r\n\r\nIn order to reproduce the bug I believe an event dropper chart with dynamically set event drop colors should display the bug. Zooming in and out should create the described behavior where drop colors switch around.\r\n\r\n**Related code:**\r\n\r\n<!-- If you are able to illustrate the bug or feature request with an example, please provide a sample application via one of the following means:\r\n\r\n* JSFiddle (https://jsfiddle.net/6rqxusw5/9/)\r\n* A sample application via GitHub\r\n-->\r\n\r\n```\r\ndrop: {\r\n          date: (data: any) => data.date,\r\n          color: (data : any) => this.renderDropColor(data),\r\n          ...\r\n}\r\n\r\nrenderDropColor(data: any) {\r\n    if (typeof data.eventData.dropColor === 'undefined') {\r\n      if (data.eventData.type === 'sentimentScore') {\r\n        const score = data.eventData.sentimentScore;\r\n        const redVal = score <= 0 ? 255 : Math.round(255 - Math.abs(255 * score));\r\n        const greenVal = score >= 0 ? 255 : Math.round(255 - Math.abs(255 * score));\r\n        data.eventData.dropColor = `rgba(${redVal}, ${greenVal}, 0, 1)`;\r\n      } else {\r\n        data.eventData.dropColor = '';\r\n      }\r\n    }\r\n    return data.eventData.dropColor;\r\n}\r\n```\r\n\r\nI believe this is the majority of related code, but if anything else would help let me know.\r\n\r\n```\r\ninsert short code snippets here\r\n```\r\n\r\n**Other information:**\r\n\r\n<!-- List any other information that is relevant to your issue. Stack traces, related issues, suggestions on how to fix, Stack Overflow links, forum links, etc. For visual or layout problems, please include images or animated gifs.-->\r\n\r\n**Environment**\r\n\r\n* EventDrops version: ^1.3.0\r\n* Browser: Chrome \r\n"},"comment":{"url":"https://api.github.com/repos/marmelab/EventDrops/issues/comments/491370877","html_url":"https://github.com/marmelab/EventDrops/issues/267#issuecomment-491370877","issue_url":"https://api.github.com/repos/marmelab/EventDrops/issues/267","id":491370877,"node_id":"MDEyOklzc3VlQ29tbWVudDQ5MTM3MDg3Nw==","user":{"login":"Busteren","id":15114362,"node_id":"MDQ6VXNlcjE1MTE0MzYy","avatar_url":"https://avatars2.githubusercontent.com/u/15114362?v=4","gravatar_id":"","url":"https://api.github.com/users/Busteren","html_url":"https://github.com/Busteren","followers_url":"https://api.github.com/users/Busteren/followers","following_url":"https://api.github.com/users/Busteren/following{/other_user}","gists_url":"https://api.github.com/users/Busteren/gists{/gist_id}","starred_url":"https://api.github.com/users/Busteren/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Busteren/subscriptions","organizations_url":"https://api.github.com/users/Busteren/orgs","repos_url":"https://api.github.com/users/Busteren/repos","events_url":"https://api.github.com/users/Busteren/events{/privacy}","received_events_url":"https://api.github.com/users/Busteren/received_events","type":"User","site_admin":false},"created_at":"2019-05-10T17:37:05Z","updated_at":"2019-05-10T17:37:05Z","author_association":"CONTRIBUTOR","body":"The current release is 1.3.0. However, there are some bugfixes not release yet, which I think might cause this error. So download latest master and run the **build** command in makefile"}}
{"actor":{"display_login":"Busteren"}}