diff --git a/plots/highcharts/line/line-basic/default.py b/plots/highcharts/line/line-basic/default.py
index 17aef67a44..cc5da7ad25 100644
--- a/plots/highcharts/line/line-basic/default.py
+++ b/plots/highcharts/line/line-basic/default.py
@@ -3,7 +3,6 @@
Library: highcharts
"""
-import json
import tempfile
import time
import urllib.request
@@ -17,10 +16,10 @@
# Data
-time_values = ["1", "2", "3", "4", "5", "6", "7"]
-values = [10, 15, 13, 18, 22, 19, 25]
+time_values = [1, 2, 3, 4, 5, 6, 7]
+value_data = [10, 15, 13, 18, 22, 19, 25]
-# Create chart with container
+# Create chart with container specified
chart = Chart(container="container")
chart.options = HighchartsOptions()
@@ -30,7 +29,7 @@
"width": 4800,
"height": 2700,
"backgroundColor": "#ffffff",
- "style": {"fontFamily": "Arial, sans-serif"},
+ "spacing": [20, 40, 80, 40],
}
# Title
@@ -38,34 +37,32 @@
# Axes
chart.options.x_axis = {
- "title": {"text": "Time", "style": {"fontSize": "40px"}},
- "labels": {"style": {"fontSize": "32px"}, "enabled": True},
- "categories": time_values,
- "gridLineWidth": 1,
- "gridLineColor": "#e0e0e0",
- "lineWidth": 2,
- "tickWidth": 2,
+ "title": {"text": "Time", "style": {"fontSize": "36px"}},
+ "categories": [str(t) for t in time_values],
+ "labels": {"style": {"fontSize": "28px"}},
}
chart.options.y_axis = {
- "title": {"text": "Value", "style": {"fontSize": "40px"}},
- "labels": {"style": {"fontSize": "32px"}},
+ "title": {"text": "Value", "style": {"fontSize": "36px"}},
+ "labels": {"style": {"fontSize": "28px"}},
"gridLineColor": "#e0e0e0",
- "lineWidth": 2,
}
-# Legend (not needed for single series)
+# Legend
chart.options.legend = {"enabled": False}
-# Disable credits
-chart.options.credits = {"enabled": False}
+# Plot options
+chart.options.plot_options = {
+ "line": {
+ "lineWidth": 4,
+ "marker": {"enabled": True, "radius": 8, "fillColor": "#306998", "lineWidth": 2, "lineColor": "#ffffff"},
+ }
+}
-# Create and add series
+# Create series
series = LineSeries()
-series.data = values
+series.data = value_data
series.name = "Value"
series.color = "#306998"
-series.marker = {"enabled": True, "radius": 8, "fillColor": "#306998"}
-series.line_width = 4
chart.add_series(series)
@@ -74,8 +71,8 @@
with urllib.request.urlopen(highcharts_url, timeout=30) as response:
highcharts_js = response.read().decode("utf-8")
-# Generate HTML with inline scripts using JSON approach for reliability
-opts_json = json.dumps(chart.options.to_dict())
+# Generate HTML with inline scripts
+html_str = chart.to_js_literal()
html_content = f"""
@@ -84,9 +81,7 @@
-
+
"""
@@ -100,13 +95,13 @@
chrome_options.add_argument("--no-sandbox")
chrome_options.add_argument("--disable-dev-shm-usage")
chrome_options.add_argument("--disable-gpu")
-chrome_options.add_argument("--window-size=4800,2800")
+chrome_options.add_argument("--window-size=4900,2800")
driver = webdriver.Chrome(options=chrome_options)
driver.get(f"file://{temp_path}")
time.sleep(5)
-# Take screenshot of just the chart container element
+# Get the chart container element and take screenshot of it
container = driver.find_element("id", "container")
container.screenshot("plot.png")
driver.quit()