html - highchart 中的图表位置

Question

我创建了 2 个 highcharts 即

<div>
   <p id="container">
   </p>
   <p id="cont">
   </p>

   </div>

我是这样设置宽度和高度的

 $('#cont').highcharts({
            chart: {
                width: 500,
                height: 300,

                type: 'pie',
                options3d: {
                    enabled: true,
                    alpha: 45
                }
            },

cont chart is under container chart 但我希望图表都在同一行检查这个

http://i.stack.imgur.com/bUpHZ.png

还有我如何添加边框

Answer 1

angular gauge demo on the Highcharts website展示了如何执行此操作的一个很好的示例。

在他们的代码中，他们安排并设置了 <div> 的样式。像这样的元素:

<div style="width: 600px; height: 400px; margin: 0 auto">
    <div id="container-speed" style="width: 300px; height: 200px; float: left"></div>
    <div id="container-rpm" style="width: 300px; height: 200px; float: left"></div>
</div>

这是它的样子:

现在，就向您的图表添加边框而言，您可以按照以下方式进行操作:

    chart: {
        type: 'solidgauge',
        borderColor: 'red',
        borderWidth: 1
    },

这会将这些图表更改为:

查看 API 文档以获取有关如何更改图表其他外观选项(包括边框半径和背景颜色)的更多详细信息:http://api.highcharts.com/highcharts#chart

希望对您有所帮助。