CanvasBaseGraphComponent constructor

CanvasBaseGraphComponent(
  1. RenderComponent parent,
  2. String id, {
  3. double maxLabelWidthX = 50,
  4. double maxLabelWidthY = 20,
  5. String labelFormatX(
    1. double label
    ) = _defaultLabelFormat,
  6. String labelFormatY(
    1. double label
    ) = _defaultLabelFormat,
  7. double textMargin = 15,
  8. double aspectRatio = 1.5,
  9. double gridLineWidth = 1,
  10. String gridLineStrokeStyle = '#d7d7d7',
  11. String labelFillStyle = '#aaaaaa',
  12. String labelFontStyle = '14px sans-serif',
  13. String captionBgColor = '#2d2d2d',
  14. String captionFgColor = 'white',
  15. String captionFontFamily = 'sans-serif',
  16. bool drawGridY = false,
})

Implementation

CanvasBaseGraphComponent(super.parent, super.id, {
  this.maxLabelWidthX = 50,
  this.maxLabelWidthY = 20,
  this.labelFormatX = _defaultLabelFormat,
  this.labelFormatY = _defaultLabelFormat,
  super.textMargin = 15,
  super.aspectRatio = 1.5,
  super.gridLineWidth = 1,
  super.gridLineStrokeStyle = '#d7d7d7',
  super.labelFillStyle = '#aaaaaa',
  super.labelFontStyle = '14px sans-serif',
  super.captionBgColor = '#2d2d2d',
  super.captionFgColor = 'white',
  super.captionFontFamily = 'sans-serif',
  super.drawGridY = false,
}) {
  baseInnerHtml = '''
  <div id="$id" style="position: relative;overflow-x: auto;">
      <canvas id="$id-canvas"></canvas>
      <svg xmlns="http://www.w3.org/2000/svg" id="$id-caption" class="$id-caption" preserveAspectRatio="xMinYMin meet" style="position: absolute;top: 0;left: 0;">
       <defs>
        <filter id="$id-dropshadow" color-interpolation-filters="sRGB" x="-40%" y="-40%" width="180%" height="180%">
          <feGaussianBlur in="SourceAlpha" stdDeviation="4"/> <!-- stdDeviation is how much to blur -->
          <feOffset dx="3" dy="3" result="offsetblur"/> <!-- how much to offset -->
          <feComponentTransfer>
              <feFuncA type="linear" slope="0.3"/> <!-- slope is the opacity of the shadow -->
          </feComponentTransfer>
          <feMerge>
              <feMergeNode/> <!-- this contains the offset blurred image -->
              <feMergeNode in="SourceGraphic"/> <!-- this contains the element that the filter is applied to -->
          </feMerge>
        </filter>
       </defs>
       <g visibility="hidden" id="$id-caption-g">
          <rect id="$id-caption-g-rect" width="88" height="33" ry="3" fill="$captionBgColor" filter="url(#$id-dropshadow)" />
          <text id="$id-caption-g-text" x="44" y="16.5" text-anchor="middle" dominant-baseline="middle" fill="$captionFgColor" font-family="$captionFontFamily" font-size="16px" letter-spacing="0px" xml:space="preserve">Text</text>
       </g>
      </svg>
  </div>
  ''';
}