Search the Community

When creating bullet charts, the height is not consistent between multiple charts. The image below shows several charts, all with a height specified, however some charts appear small and ignore the height property. Is there a way to ensure the height is properly set? <ReactFusioncharts type="hbullet" width="100%" height={80} dataFormat="JSON" dataSource={dataSource} />

Hello. I have a AngularGauge chart with Vue.js. I configure gauge for dynamic resizing, like in manual. Code of my component: ``` <template> <div id="chart-container"> <fusioncharts :type="type" :width="width" :height="height" :data-format="dataFormat" :data-source="chartData" > </fusioncharts> </div> </template> <script> import { mapState } from "vuex"; export default { name: "AngularGauge", props: { dataValue: String, title: String, colorRange: Object }, computed: { ...mapState({ switchedTheme: state => state.switchedTheme }), chartData() { return { chart: { manageResize: "1", captionFont: "Roboto-Light", captionFontColor: this.switchedTheme ? "#262626" : "#ffffff", captionFontSize: "20", captionFontBold: "0", bgColor: this.switchedTheme ? "#ffffff" : "#262626", usePlotGradientColor: "1", pivotFillAlpha: "0", pivotBorderAlpha: "0", valueFont: "Roboto-Regular", valueFontSize: "40rem", valueFontColor: "#3F903E", valueBorderRadius: "3", valuePadding: "10", lowerLimit: this.colorRange.minRangeValue, upperLimit: this.colorRange.maxRangeValue, lowerLimitDisplay: this.colorRange.minRangeValue, upperLimitDisplay: this.colorRange.maxRangeValue, showValue: this.dataValue, valueBelowPivot: "1", theme: "fusion" }, colorRange: { color: [ { minvalue: this.colorRange.low.minvalue, maxvalue: this.colorRange.low.maxvalue, code: "#3B953A" }, { minValue: this.colorRange.middle.minvalue, maxValue: this.colorRange.middle.maxvalue, code: "#E3A402" }, { minValue: this.colorRange.max.minvalue, maxValue: this.colorRange.max.maxvalue, code: "#C22424" } ] }, dials: { dial: [ { radius: 165, baseWidth: 145, baseRadius: 25, topWidth: 1, rearExtension: 0, value: this.dataValue, valueY: 213, bgColor: this.switchedTheme ? "#006FBA" : "#793DC0" }, { radius: 132, baseWidth: 148, bgColor: this.switchedTheme ? "#ffffff" : "#262626", borderAlpha: 0, baseRadius: 25, topWidth: 40, rearExtension: 2, value: this.dataValue, showValue: "0" } ] }, annotations: { origw: 500, origh: 272, autoscale: "1" } }; } }, data() { return { type: "angulargauge", renderAt: "chart-container", width: "100%", height: "100%", dataFormat: "json" }; } }; </script> <style> #chart-container { position: relative; width: 100%; height: 100%; } </style> ``` I added width and height for component in percents. And added menageResize: "1", autoScale: "1". But when I resize a page, AngularGauge only change your width. Height didn't change at all. In console I have this errors: ``` fusioncharts.js?8f68:13 Error: <path> attribute d: Expected number, "MNaN,NaNQ0,0,NaN,…". e._setFillAndStroke @ fusioncharts.js?8f68:13 ``` How can I fix this problem ?

Hi, I think there's a bug : maxBarHeight isn't working anymore. Please find the issue on this code pen link.

I am trying to set the chart 'height' parameter in code for a multi line chart container. Using 100% results in a smaller chart than I want, yet setting specific pixels is better. I want to be able to detect the web browser height in pixels and use a 'height' parameter based on the pixel result. Can anybody help me with this. My attempts have resulted in a failure to render the chart. I am a beginner with Javascript. I have attached a sample file. drivers2018test.html

Hi, Is is possible to control the height of the Gantt chart dynamically? I'm using the Gantt chart with pagination, so one time I have multiple processes to show and the other time I have just 1 process to show. In JavaScript I create the Gantt chart as follows: var chart = new FusionCharts( "Gantt", "ganttID", "100%", "100%"); // height = 100% When I have 12 processes (rows) then the chart will render at 611px, when I select only one row it will not alter the height. See attached screenshots to clarify my problem. Is it possible to let the chart determine it's own height depending on it's content? So something like height: auto... P.s. I know I can use some callbacks of the chart (like BeforeDataUpdate) where I can determine the number of rows myself and adjust the height of the chart manually. But I would like that to be some default functionality supported by FusionCharts...