samber / samber/chartjs-plugin-datasource-prometheus

borderColor is only creating black color

Open
#51 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
123
Forks
23
PR merge metrics
No merged PRs in 30d

Description

When configuring a chart borderColor I have found that is only changes the color to black. I have tried rgb settings, color name and CSS colors.

I have also tried to color option many other places without it changing the color.

Image

var myChart3 = new Chart(document.getElementById('myChart3'), {
  type: 'line',
  plugins: [ChartDatasourcePrometheusPlugin],
          options: {
          backgroundColor: 'green',
            plugins: {
              color: false,
              title: {
                display: true,
                text: 'myText',
               },
              'datasource-prometheus': {
                borderColor: 'white',
                prometheus: {
                  endpoint: "testmyhttp",
                  baseURL: "/api/v1",
                },
                query: 'myquery',
                timeRange: {
                  type: 'relative',

                  // from 12 hours ago to now
                  start: -12 * 60 * 60 * 1000,
                  end: 0,
                },
              },
            },
          },
});

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the supplied Chart.js configuration with the datasource-prometheus plugin and inspect how its borderColor option is handled. Trace the option from the plugin configuration to the generated chart dataset, then verify that a color such as white is applied instead of black.

Written by the indexing model from the issue text.

Assessment

Tech stack
chartjs, prometheus, typescript
Domain
data-visualization
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.