{"id":18544972,"url":"https://github.com/dominikangerer/vue-heatmap","last_synced_at":"2025-04-09T19:31:47.261Z","repository":{"id":22155895,"uuid":"95446898","full_name":"DominikAngerer/vue-heatmap","owner":"DominikAngerer","description":"A github style inspired heatmap capsuled as an easy to use vuejs component","archived":false,"fork":false,"pushed_at":"2022-12-07T17:45:12.000Z","size":847,"stargazers_count":58,"open_issues_count":18,"forks_count":13,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-10-27T05:44:47.522Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://www.dominikangerer.com/projects/vuejs-heatmap/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/DominikAngerer.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-06-26T13:02:10.000Z","updated_at":"2024-02-01T11:08:00.000Z","dependencies_parsed_at":"2023-01-11T21:30:21.180Z","dependency_job_id":null,"html_url":"https://github.com/DominikAngerer/vue-heatmap","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DominikAngerer%2Fvue-heatmap","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DominikAngerer%2Fvue-heatmap/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DominikAngerer%2Fvue-heatmap/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DominikAngerer%2Fvue-heatmap/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/DominikAngerer","download_url":"https://codeload.github.com/DominikAngerer/vue-heatmap/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223408083,"owners_count":17140622,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-06T20:18:29.136Z","updated_at":"2024-11-06T20:18:29.871Z","avatar_url":"https://github.com/DominikAngerer.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# vue-heatmap\n\n\u003e The github style inspired calendar-heatmap capsuled as an easy to use vue.js component\n\n\u003e A [d3.js](https://d3js.org/) heatmap representing time series data. Inspired by Github's contribution chart\n\n![Reusable D3.js Calendar Heatmap chart](https://raw.githubusercontent.com/DKirwan/calendar-heatmap/develop/example/thumbnail.png)\n\n# [Demo Link](http://www.dominikangerer.com/projects/vuejs-heatmap/)\n\n# How to use:\n\n```\n# 1. Install Vuejs heatmap\nnpm install --save vuejs-heatmap\n\n# 2. Import\nimport VuejsHeatmap from 'vuejs-heatmap'\n\n# 3. Use\n\u003cvuejs-heatmap\u003e\u003c/vuejs-heatmap\u003e\n```\n\n## Props\n\n### selector `selector`\n\nAny string which should be the selector, use it for multiple heatmaps on one site.\n\n```\n'myFirstSelector'\n```\n\n### entries `entries`\n\n```\n[\n  {\n    \"counting\": 2070,\n    \"created_at\": \"2018-06-21\"\n  },\n  {\n    \"counting\": 3493,\n    \"created_at\": \"2018-06-22\"\n  }\n]\n```\n\n### colorRange `color-range`\n\n```\n['#c9ecec', '#09b3af']\n```\n\n### tooltipEnabled `tooltip-enabled`\n\n```\ntrue/false\n```\n\n### tooltipUnit `tooltip-unit`\n\n```\n'Star'\n```\n\n### locale `locale`\n\n```\n{\n  months: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],\n  days: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],\n  No: 'No',\n  on: 'on',\n  Less: 'Less',\n  More: 'More'\n}\n```\n\n### max `max`\n\nAny number which should be the max color.\n\n### onClick `on-click`\n\nA function that should be called if clicked, will receive an object as first parameter:\n\n```\n{\n  count: 123,\n  date: DateObject,\n  entry: { \n    counting: 123,\n    created_at: \"2018-01-24\"\n    // every property you pass in your entries.\n  }\n}\n```\n\n\n## Build Setup\n\n``` bash\n# install dependencies\nnpm install\n\n# serve with hot reload at localhost:8080\nnpm run dev\n\n# build for production with minification\nnpm run build\n\n# build for production and view the bundle analyzer report\nnpm run build --report\n```\n\nFor detailed explanation on how things work, checkout the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).\n\n\n# Thanks [@DKirwan](https://github.com/DKirwan) for the initial calendar-heatmap.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdominikangerer%2Fvue-heatmap","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdominikangerer%2Fvue-heatmap","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdominikangerer%2Fvue-heatmap/lists"}