jQWidgets jqxHeatMap paletteSettings属性

jQWidgets jqxHeatMap 是一种热力图控件，用于在 Web 应用程序中创建热力图。paletteSettings 属性是 jqxHeatMap 控件的一个属性，用于设置热力图的颜色映射。本文将详细讲解 paletteSettings 的使用方法，并提供两个示例。

属性

paletteSettings 属性用于设置 jqxHeatMap 控件的颜色映射。该属性接受一个对象参数，包含以下属性：

• palette: 设置颜色映射的调色板。默认值为 "gradient", 可选值为 "scheme01", "scheme02", "scheme03", "scheme04", "scheme05", "scheme06", "scheme07", "scheme08", "scheme09", "scheme10", "scheme11", "scheme12", "scheme13", "scheme14", "scheme15", "scheme16", "scheme17", "scheme18", "scheme19", "scheme20", "scheme21", "scheme22", "scheme23", "scheme24", "scheme25", "scheme26", "scheme27", "scheme28", "scheme29", "scheme30", "custom".
• paletteColors: 设置自定义调色板的颜色数组。默认值为 null。
• colorMin: 设置颜色映射的最小值。默认值为 null。
• colorMax: 设置颜色映射的最大值。默认值为 null。
• colorRange: 设置颜色映射的范围。默认值为 null。
• colorMode: 设置颜色映射的模式。默认值为 "gradient", 可选值为 "fixed", "gradient"。

以下是一个示例：

// jqxHeatMap 控件
$("#jqxHeatMap").jqxHeatMap({
    source: data,
    paletteSettings: {
        palette: "scheme01",
        colorMin: 0,
        colorMax: 100,
        colorRange: 20,
        colorMode: "gradient"
    }
});

在上述代码中，我们创建了 jqxHeatMap 控件，并使用 paletteSettings 属性设置热力图的颜色映射。我们设置了调色板为 "scheme01", 最小值为 0, 最大值为 100, 范围为 20, 模式为 "gradient"。

示例

以下是两个示例演示如何使用 paletteSettings 属性。

示例 1

在此示例中，我们创建了一个 jqxHeatMap 控件，并使用 paletteSettings 属性设置热力图的颜色映射。我们设置了调色板为 "scheme02", 最小值为 0, 最大值为 , 范围为 , 模式为 "gradient"。

// jqxHeatMap 控件
$("#jqxHeatMap").jqxHeatMap({
    source: data,
    paletteSettings: {
        palette: "scheme02",
        colorMin: 0,
        colorMax: 100,
        colorRange: 20,
        colorMode: "gradient"
    }
});

在上述代码中，我们创建了一个 jqxHeatMap 控件，并使用 paletteSettings 属性设置热力图的颜色映射。我们设置了调色板为 "scheme02", 最小值为 0, 最大值为 100, 范围为 20, 模式为 "gradient"。

示例 2

在此示例中，我们创建了一个 jqxHeatMap 控件使用 paletteSettings 属性设置热力图的颜色映射。我们设置了自定义调色板的颜色数组，最小值为 0, 最大值为 100, 范围为 20, 模式为 "gradient"。

// jqxHeatMap 控件
$("#jqxHeatMap").jqxHeatMap({
    source: data,
    paletteSettings: {
        palette: "custom",
        paletteColors: ["#FF0000", "#FFFF00", "#00FF00", "#00FFFF", "#0000FF"],
        colorMin: 0,
        colorMax: 100,
        colorRange: 20,
        colorMode: "gradient"
    }
});

在上述代码中，我们创建了一个 jqxHeatMap 控件，并使用 paletteSettings 属性设置热力图的颜色映射。我们设置了自定义调色板的颜色数组，最小值为 0, 最大值为 100, 范围为 20, 模式为 "gradient"。

以上是 jqxHeatMap 的 paletteSettings 属性的详细说明，以及两个示例。在示例中，我们使用 paletteSettings 属性设置热力图的颜色映射，包括调色板、颜色数组、最小值、最大值、范围和模式。